From c1961a828236d031e26d3afbcd0fbd237191fdb7 Mon Sep 17 00:00:00 2001
From: fyzanshaik <fyzan.shaik@gmail.com>
Date: Mon, 5 Aug 2024 23:28:52 +0530
Subject: Scroll bar added

---
 apps/web/app/(dash)/chat/chatWindow.tsx | 39 ++++++++++++++++++++++++++++++---
 apps/web/tailwind.config.ts             | 21 +++++++++++++++++-
 2 files changed, 56 insertions(+), 4 deletions(-)

(limited to 'apps/web')

diff --git a/apps/web/app/(dash)/chat/chatWindow.tsx b/apps/web/app/(dash)/chat/chatWindow.tsx
index a691c0ce..fcbcfc26 100644
--- a/apps/web/app/(dash)/chat/chatWindow.tsx
+++ b/apps/web/app/(dash)/chat/chatWindow.tsx
@@ -384,10 +384,10 @@ function ChatWindow({
 														</AccordionTrigger>
 														{/* TODO: fade out content on the right side, the fade goes away when the user scrolls */}
 														<AccordionContent
-															className="flex flex-col no-scrollbar overflow-auto gap-4 relative max-w-3xl no-scrollbar"
+															className="flex flex-col gap-4 relative max-w-3xl overflow-x-auto  scrollbar-thin scrollbar-thumb-scrollbar-thumb scrollbar-track-scrollbar-track scrollbar-thumb-rounded"
 															defaultChecked
 														>
-															<div className="w-full no-scrollbar flex gap-4">
+															<div className="w-full flex gap-3">
 																{/* Loading state */}
 																{chat.answer.sources.length > 0 ||
 																	(chat.answer.parts.length === 0 && (
@@ -415,7 +415,9 @@ function ChatWindow({
 																			<span>{source.type}</span>
 
 																			{source.numChunks > 1 && (
-																				<span>{source.numChunks} chunks</span>
+																				<span className="font-bold">
+																					{source.numChunks} chunks
+																				</span>
 																			)}
 																		</div>
 																		<div className="text-base">
@@ -461,6 +463,37 @@ function ChatWindow({
 																</div>
 															)}
 														</AccordionContent>
+														{/* <AccordionContent
+															className="flex flex-col gap-4 relative max-w-3xl overflow-x-auto  scrollbar-thin scrollbar-thumb-scrollbar-thumb scrollbar-track-scrollbar-track scrollbar-thumb-rounded"
+															defaultChecked
+														>
+															<div className="w-full flex gap-3">
+																{mockRelatedMemories.map((source, idx) => (
+																	<Link
+																		href={source.source}
+																		key={idx}
+																		className="w-[350px] shrink-0 p-4 gap-2 rounded-2xl flex flex-col bg-secondary"
+																		target="_blank"
+																		rel="noopener noreferrer"
+																	>
+																		<div className="flex justify-between text-foreground-menu text-sm">
+																			<span>{source.type}</span>
+																			{source.numChunks > 1 && (
+																				<span>{source.numChunks} chunks</span>
+																			)}
+																		</div>
+																		<div className="text-base">
+																			{source.title}
+																		</div>
+																		<div className="text-xs line-clamp-2">
+																			{source.content.length > 100
+																				? source.content.slice(0, 100) + "..."
+																				: source.content}
+																		</div>
+																	</Link>
+																))}
+															</div>
+														</AccordionContent> */}
 													</AccordionItem>
 												</Accordion>
 											</div>
diff --git a/apps/web/tailwind.config.ts b/apps/web/tailwind.config.ts
index cf1434cf..2a05cd74 100644
--- a/apps/web/tailwind.config.ts
+++ b/apps/web/tailwind.config.ts
@@ -1 +1,20 @@
-module.exports = require("@repo/tailwind-config/tailwind.config");
+// Import the existing Tailwind config from your shared repository
+const sharedConfig = require("@repo/tailwind-config/tailwind.config");
+
+module.exports = {
+	presets: [sharedConfig],
+	theme: {
+		extend: {
+			colors: {
+				scrollbar: {
+					// thumb: "#d1d5db",
+					// thumbHover: "#1D4ED8",
+					thumb: "#303c4c",
+					thumbHover: "#2E3A48",
+					track: "#1F2937",
+				},
+			},
+		},
+	},
+	plugins: [require("tailwind-scrollbar")({ nocompatible: true })],
+};
-- 
cgit v1.2.3