info/developer-roadmap
1
0
Fork 0
mirror of https://github.com/kamranahmedse/developer-roadmap.git synced 2025-09-09 00:30:40 +02:00
Code Issues Releases Wiki Activity

wip

Browse Source
This commit is contained in:
Arik Chakma
2025-06-10 13:21:12 +06:00
parent 278ff39c91
commit b574f1ebf5
2 changed files with 55 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/AIChatHistory/ListChatHistory.tsx
View File

@@ -101,7 +101,7 @@ export function ListChatHistory(props: ListChatHistoryProps) {
return (
<div
className={cn(
'w-[255px] shrink-0 border-r border-gray-200 bg-white p-2',
'flex w-[255px] shrink-0 flex-col justify-start border-r border-gray-200 bg-white p-2',
!isOpen && 'hidden',
)}
>
@@ -110,6 +110,7 @@ export function ListChatHistory(props: ListChatHistoryProps) {
{!isLoading && !isError && (
<>
<div>
<div className="mb-4 flex items-center justify-between">
<h1 className="font-medium text-gray-900">Chat History</h1>
<button
@@ -133,8 +134,9 @@ export function ListChatHistory(props: ListChatHistoryProps) {
</button>
<SearchInput onSearch={setQuery} isLoading={isLoading} />
</div>
<div className="mt-6 space-y-4">
<div className="scrollbar-track-transparent scrollbar scrollbar-thumb-gray-300 -mx-2 mt-6 grow space-y-4 overflow-y-auto px-2">
{Object.entries(groupedChatHistory ?? {}).map(([key, value]) => {
if (value.histories.length === 0) {
return null;
@@ -162,7 +164,6 @@ export function ListChatHistory(props: ListChatHistoryProps) {
</div>
);
})}
</div>
{hasNextPage && (
<div className="mt-4">
@@ -183,6 +184,7 @@ export function ListChatHistory(props: ListChatHistoryProps) {
</button>
</div>
)}
</div>
</>
)}
</div>

8
src/components/AIChatHistory/ListChatHistorySkeleton.tsx
View File

@@ -1,6 +1,7 @@
export function ListChatHistorySkeleton() {
return (
<>
<div>
<div className="mb-4 flex items-center justify-between gap-2">
<div className="h-6 w-1/2 animate-pulse rounded bg-gray-200" />
@@ -15,12 +16,13 @@ export function ListChatHistorySkeleton() {
<div className="h-4 w-4 animate-pulse rounded-full bg-gray-300" />
</div>
</div>
</div>
<div className="mt-6 space-y-4">
<div className="scrollbar-track-transparent scrollbar scrollbar-thumb-gray-300 -mx-2 mt-6 grow space-y-4 overflow-y-auto px-2">
{['Today', 'Last 7 Days', 'Older'].map((group) => (
<div key={group}>
<div className="ml-2 h-4 w-16 animate-pulse rounded bg-gray-200" />
<ul className="mt-1 space-y-0.5 px-2">
<div className="h-4 w-16 animate-pulse rounded bg-gray-200" />
<ul className="mt-1 space-y-0.5">
{[1, 2, 3].map((i) => (
<li
key={i}