From 9aac19a12e21c819bb4c6ed216b5de680617280a Mon Sep 17 00:00:00 2001
From: Srujan Gurram <srujangs8@gmail.com>
Date: Mon, 25 Sep 2023 04:25:48 +0530
Subject: [PATCH] Create chat history with the title of the current active
 tab's URL hostname if the current chat ID is the initial chat ID

---
 src/components/Sidebar/chat/ChatHistory.tsx |  4 +-
 src/components/Sidebar/layout/header.tsx    | 44 ++++++++++-----------
 src/hooks/useChatHistory.tsx                | 16 +++++++-
 3 files changed, 38 insertions(+), 26 deletions(-)

diff --git a/src/components/Sidebar/chat/ChatHistory.tsx b/src/components/Sidebar/chat/ChatHistory.tsx
index 9f1fa76b..bcabb806 100644
--- a/src/components/Sidebar/chat/ChatHistory.tsx
+++ b/src/components/Sidebar/chat/ChatHistory.tsx
@@ -7,13 +7,11 @@ const ChatHistory = () => {
     useChatHistory();
 
   const currentChat = getChatHistory(currentChatId);
-  console.log(currentChatId);
-  console.log(currentChat, history);
 
   return (
     <div>
       <Select.Root>
-        <Select.Trigger className="cdx-border cdx-p-2 cdx-rounded-sm">
+        <Select.Trigger className="cdx-border cdx-border-neutral-500/20 cdx-flex cdx-gap-2 cdx-items-center cdx-py-2 cdx-px-3 cdx-text-sm cdx-text-neutral-700 dark:cdx-text-neutral-300 cdx-rounded-md">
           <RiTimeLine /> {currentChat?.name}
         </Select.Trigger>
         <Select.Content>
diff --git a/src/components/Sidebar/layout/header.tsx b/src/components/Sidebar/layout/header.tsx
index cd301fc6..cb4d6394 100644
--- a/src/components/Sidebar/layout/header.tsx
+++ b/src/components/Sidebar/layout/header.tsx
@@ -1,46 +1,46 @@
-import { useEffect, useState } from 'react'
-import { BsRobot } from 'react-icons/bs'
-import { HiOutlineCog, HiX } from 'react-icons/hi'
+import { useEffect, useState } from "react";
+import { BsRobot } from "react-icons/bs";
+import { HiOutlineCog, HiX } from "react-icons/hi";
 
 const Header = () => {
-  const [shortcut, setShortcut] = useState<string | null>(null)
+  const [shortcut, setShortcut] = useState<string | null>(null);
   const onToggle = () => {
-    chrome.runtime.sendMessage({ action: 'close-sidebar' })
-  }
+    chrome.runtime.sendMessage({ action: "close-sidebar" });
+  };
 
-  const settingsPage = chrome.runtime.getURL('/src/pages/settings/index.html')
+  const settingsPage = chrome.runtime.getURL("/src/pages/settings/index.html");
 
   const handleModifyShortcut = () => {
-    chrome.tabs.update({ url: 'chrome://extensions/shortcuts' })
-  }
+    chrome.tabs.update({ url: "chrome://extensions/shortcuts" });
+  };
 
   useEffect(() => {
     chrome.commands.getAll((commands) => {
       const command = commands.find(
-        (command) => command.name === 'open-sidebar',
-      )
-      if (command) setShortcut(command.shortcut || null)
-    })
-  }, [])
+        (command) => command.name === "open-sidebar"
+      );
+      if (command) setShortcut(command.shortcut || null);
+    });
+  }, []);
 
   return (
-    <div className="cdx-flex cdx-justify-between cdx-p-3.5 cdx-border-b dark:cdx-border-neutral-700/50 cdx-border-neutral-200">
+    <div className="cdx-flex cdx-justify-between cdx-p-3.5 cdx-border-b dark:cdx-border-neutral-700/50 cdx-border-neutral-300">
       <h1 className="cdx-text-2xl cdx-flex cdx-items-center cdx-gap-2 cdx-m-0 cdx-p-0">
-        <BsRobot className='cdx-text-blue-400' />
+        <BsRobot className="cdx-text-blue-400" />
         Syncia
       </h1>
 
-      <div className='cdx-flex cdx-text-neutral-500 cdx-gap-2 cdx-items-center'>
+      <div className="cdx-flex cdx-text-neutral-500 cdx-gap-2 cdx-items-center">
         <button
           onClick={handleModifyShortcut}
           className="cdx-flex cdx-items-center cdx-gap-2"
         >
           <span className="cdx-text-xs cdx-text-neutral-500  dark:cdx-bg-black/20 cdx-bg-black/10 cdx-border cdx-rounded-full cdx-border-neutral-400/30 dark:cdx-border-neutral-500/50 cdx-px-2 cdx-py-0.5">
-            {shortcut ? `Shortcut: ${shortcut}` : 'No shortcut'}
+            {shortcut ? `Shortcut: ${shortcut}` : "No shortcut"}
           </span>
         </button>
         <a
-          target='_blank'
+          target="_blank"
           rel="noreferrer"
           className="cdx-text-xl"
           href={settingsPage}
@@ -52,7 +52,7 @@ const Header = () => {
         </button>
       </div>
     </div>
-  )
-}
+  );
+};
 
-export default Header
+export default Header;
diff --git a/src/hooks/useChatHistory.tsx b/src/hooks/useChatHistory.tsx
index 82a9a77d..88a91363 100644
--- a/src/hooks/useChatHistory.tsx
+++ b/src/hooks/useChatHistory.tsx
@@ -31,9 +31,23 @@ export const useChatHistory = () => {
 
     return newId;
   };
+  chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
+    const tab = tabs[0];
+    if (tab) {
+      console.log(tab);
+    }
+  });
 
   if (currentChatId === initialChatId) {
-    createChatHistory("Default Chat");
+    chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => {
+      const tab = tabs[0] as any;
+      if (tab) {
+        const data = JSON.parse(tab.vivExtData);
+        const url = data.urlForThumbnail;
+        const title = new URL(url).hostname;
+        createChatHistory(title);
+      }
+    });
   }
 
   const deleteChatHistory = (id: string) => {