Skip to content

Commit 8934899

Browse files
liangfungliangfung
authored
chore(ui): hide empty activities (#3998)
* chore(ui): hide empty activities * update * update: remove 'no data' condition
1 parent 50d9b1e commit 8934899

File tree

3 files changed

+202
-181
lines changed

3 files changed

+202
-181
lines changed

‎ee/tabby-ui/app/(home)/components/thread-feeds/all-threads.tsx

+72-82
Original file line numberDiff line numberDiff line change
@@ -97,8 +97,6 @@ export function AllThreadFeeds() {
9797
resetThreadsPageNo()
9898
}, [])
9999

100-
const hasThreads = !!data?.threads?.edges?.length
101-
102100
return (
103101
<div className={cn('w-full')}>
104102
<motion.div
@@ -121,90 +119,82 @@ export function AllThreadFeeds() {
121119
}
122120
delay={600}
123121
>
124-
{hasThreads ? (
125-
<>
126-
<div className="relative flex flex-col gap-3 text-sm">
127-
{threads.map(t => {
128-
return (
129-
<ThreadItem
130-
data={t}
131-
key={t.node.id}
132-
onNavigateToThread={handleNavigateToThread}
122+
<div className="relative flex flex-col gap-3 text-sm">
123+
{threads.map(t => {
124+
return (
125+
<ThreadItem
126+
data={t}
127+
key={t.node.id}
128+
onNavigateToThread={handleNavigateToThread}
129+
/>
130+
)
131+
})}
132+
{fetching && (
133+
<div className="absolute inset-0 bottom-10 z-10 flex items-center justify-center backdrop-blur-sm" />
134+
)}
135+
{showPagination && (
136+
// FIXME abstract Pagination
137+
<Pagination className={cn('flex items-center justify-end')}>
138+
<PaginationContent>
139+
<PaginationItem>
140+
<PaginationPrevious
141+
disabled={page === 1}
142+
onClick={() => {
143+
if (page === 1) return
144+
145+
const _page = page - 1
146+
setPage(_page)
147+
}}
133148
/>
134-
)
135-
})}
136-
{fetching && (
137-
<div className="absolute inset-0 bottom-10 z-10 flex items-center justify-center backdrop-blur-sm" />
138-
)}
139-
{showPagination && (
140-
// FIXME abstract Pagination
141-
<Pagination className={cn('flex items-center justify-end')}>
142-
<PaginationContent>
143-
<PaginationItem>
144-
<PaginationPrevious
145-
disabled={page === 1}
146-
onClick={() => {
147-
if (page === 1) return
148-
149-
const _page = page - 1
150-
setPage(_page)
151-
}}
152-
/>
153-
</PaginationItem>
154-
{paginationPages.map((item, index) => {
155-
return (
156-
<PaginationItem
157-
key={`${item}-${index}`}
158-
onClick={() => {
159-
if (typeof item === 'number') {
160-
setPage(item)
161-
}
162-
}}
149+
</PaginationItem>
150+
{paginationPages.map((item, index) => {
151+
return (
152+
<PaginationItem
153+
key={`${item}-${index}`}
154+
onClick={() => {
155+
if (typeof item === 'number') {
156+
setPage(item)
157+
}
158+
}}
159+
>
160+
{typeof item === 'number' ? (
161+
<PaginationLink
162+
className="cursor-pointer"
163+
isActive={item === page}
163164
>
164-
{typeof item === 'number' ? (
165-
<PaginationLink
166-
className="cursor-pointer"
167-
isActive={item === page}
168-
>
169-
{item}
170-
</PaginationLink>
171-
) : (
172-
<PaginationEllipsis />
173-
)}
174-
</PaginationItem>
175-
)
176-
})}
177-
{hasNextPage && (
178-
<PaginationItem>
165+
{item}
166+
</PaginationLink>
167+
) : (
179168
<PaginationEllipsis />
180-
</PaginationItem>
181-
)}
182-
<PaginationItem>
183-
<PaginationNext
184-
disabled={isNextPageDisabled}
185-
onClick={() => {
186-
if (isNextPageDisabled) {
187-
return
188-
}
189-
190-
const _page = page + 1
191-
setPage(_page)
192-
if (_page > pageCount) {
193-
loadMore()
194-
}
195-
}}
196-
/>
169+
)}
197170
</PaginationItem>
198-
</PaginationContent>
199-
</Pagination>
200-
)}
201-
</div>
202-
</>
203-
) : (
204-
<div className="my-12 text-center text-lg font-medium text-muted-foreground">
205-
No data
206-
</div>
207-
)}
171+
)
172+
})}
173+
{hasNextPage && (
174+
<PaginationItem>
175+
<PaginationEllipsis />
176+
</PaginationItem>
177+
)}
178+
<PaginationItem>
179+
<PaginationNext
180+
disabled={isNextPageDisabled}
181+
onClick={() => {
182+
if (isNextPageDisabled) {
183+
return
184+
}
185+
186+
const _page = page + 1
187+
setPage(_page)
188+
if (_page > pageCount) {
189+
loadMore()
190+
}
191+
}}
192+
/>
193+
</PaginationItem>
194+
</PaginationContent>
195+
</Pagination>
196+
)}
197+
</div>
208198
</LoadingWrapper>
209199
</motion.div>
210200
</div>

‎ee/tabby-ui/app/(home)/components/thread-feeds/index.tsx

+58-16
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
'use-client'
2+
3+
import { useEffect } from 'react'
14
import { motion } from 'framer-motion'
25
import { useQuery } from 'urql'
36

@@ -6,7 +9,7 @@ import {
69
setThreadsTab,
710
useAnswerEngineStore
811
} from '@/lib/stores/answer-engine-store'
9-
import { contextInfoQuery } from '@/lib/tabby/query'
12+
import { contextInfoQuery, listMyThreads, listThreads } from '@/lib/tabby/query'
1013
import { cn } from '@/lib/utils'
1114
import { IconSpinner } from '@/components/ui/icons'
1215
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
@@ -25,13 +28,49 @@ export function ThreadFeeds({
2528
className,
2629
onNavigateToThread
2730
}: ThreadFeedsProps) {
28-
// FIXME rename
2931
const threadsTab = useAnswerEngineStore(state => state.threadsTab)
3032
const [allUsers, fetchingUsers] = useAllMembers()
3133
const [{ data: contextInfoData, fetching: fetchingSources }] = useQuery({
3234
query: contextInfoQuery
3335
})
3436

37+
const [{ data: persistedThreads, fetching: fetchingPersistedThreads }] =
38+
useQuery({
39+
query: listThreads,
40+
variables: {
41+
last: 1,
42+
isEphemeral: false
43+
}
44+
})
45+
const [{ data: myThreads, fetching: fetchingMyThreads }] = useQuery({
46+
query: listMyThreads,
47+
variables: {
48+
last: 1
49+
}
50+
})
51+
52+
const loading =
53+
fetchingPersistedThreads ||
54+
fetchingMyThreads ||
55+
fetchingSources ||
56+
fetchingUsers
57+
const hasPersistedThreads = !!persistedThreads?.threads?.edges?.length
58+
const hasMyThreads = !!myThreads?.myThreads.edges.length
59+
60+
useEffect(() => {
61+
if (loading) return
62+
if (!hasPersistedThreads && !hasMyThreads) return
63+
64+
if (!hasPersistedThreads && threadsTab === 'all') {
65+
setThreadsTab('mine')
66+
} else if (!hasMyThreads && threadsTab === 'mine') {
67+
setThreadsTab('all')
68+
}
69+
}, [loading, hasPersistedThreads, hasMyThreads, threadsTab])
70+
71+
// if there's no thread, hide the section
72+
if (!hasPersistedThreads && !hasMyThreads) return null
73+
3574
return (
3675
<ThreadFeedsContext.Provider
3776
value={{
@@ -55,8 +94,7 @@ export function ThreadFeeds({
5594
}}
5695
>
5796
<LoadingWrapper
58-
// FIXME fetching threads
59-
loading={fetchingSources || fetchingUsers}
97+
loading={loading}
6098
fallback={
6199
<div className="flex justify-center">
62100
<IconSpinner className="h-8 w-8" />
@@ -71,18 +109,22 @@ export function ThreadFeeds({
71109
>
72110
<div className="flex items-center justify-between pb-3">
73111
<TabsList className="w-full justify-start border-b bg-transparent p-0">
74-
<TabsTrigger
75-
value="all"
76-
className="rounded-none border-b-2 border-b-transparent bg-transparent px-3 py-2 text-base font-medium shadow-none data-[state=active]:border-b-primary data-[state=active]:text-foreground data-[state=active]:shadow-none"
77-
>
78-
Recent Activities
79-
</TabsTrigger>
80-
<TabsTrigger
81-
value="mine"
82-
className="rounded-none border-b-2 border-b-transparent bg-transparent px-3 py-2 text-base font-medium shadow-none data-[state=active]:border-b-primary data-[state=active]:text-foreground data-[state=active]:shadow-none"
83-
>
84-
My Activities
85-
</TabsTrigger>
112+
{!!hasPersistedThreads && (
113+
<TabsTrigger
114+
value="all"
115+
className="rounded-none border-b-2 border-b-transparent bg-transparent px-3 py-2 text-base font-medium shadow-none data-[state=active]:border-b-primary data-[state=active]:text-foreground data-[state=active]:shadow-none"
116+
>
117+
Recent Activities
118+
</TabsTrigger>
119+
)}
120+
{!!hasMyThreads && (
121+
<TabsTrigger
122+
value="mine"
123+
className="rounded-none border-b-2 border-b-transparent bg-transparent px-3 py-2 text-base font-medium shadow-none data-[state=active]:border-b-primary data-[state=active]:text-foreground data-[state=active]:shadow-none"
124+
>
125+
My Activities
126+
</TabsTrigger>
127+
)}
86128
</TabsList>
87129
</div>
88130
<TabsContent value="all">

0 commit comments

Comments
 (0)