External/bichon
1
0
Fork 0
mirror of https://github.com/rustmailer/bichon.git synced 2026-08-03 07:48:34 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): Add a scrollbar when selecting a mailbox, as the mailbox list can be very long. #4

Browse Source
This commit is contained in:
rustmailer
2025-11-19 19:32:04 +08:00
parent e18b01dafb
commit ad02c76849
1 changed files with 27 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/features/accounts/components/sync-folders.tsx
+27 -17
View File
@@ -38,6 +38,7 @@ import { Skeleton } from '@/components/ui/skeleton'
import { update_account } from '@/api/account/api' import { update_account } from '@/api/account/api'
import { ToastAction } from '@/components/ui/toast' import { ToastAction } from '@/components/ui/toast'
import { AxiosError } from 'axios' import { AxiosError } from 'axios'
import { ScrollArea } from '@/components/ui/scroll-area'
interface Props { interface Props {
open: boolean open: boolean
@@ -142,23 +143,32 @@ export function SyncFoldersDialog({ currentRow, open, onOpenChange }: Props) {
{selectedFolders.length} folder(s) selected {selectedFolders.length} folder(s) selected
</div> </div>
</div> </div>
{isLoading && ( <ScrollArea className="h-[30rem] w-full pr-4 -mr-4 py-1">
<div className="space-y-2"> {isLoading && (
{[...Array(5)].map((_, i) => ( <div className="p-8 space-y-8">
<Skeleton key={i} className="h-8 w-full" /> <div className="flex flex-col items-center gap-3 text-muted-foreground">
))} <Loader2 className="h-6 w-6 animate-spin" />
</div> <span className="text-sm font-medium">Loading mailbox folders…</span>
)} </div>
{!isLoading && (
<TreeView <div className="space-y-2">
data={treeData} {[...Array(8)].map((_, i) => (
multiple <Skeleton key={i} className="h-8 w-full" />
expandAll ))}
clickRowToSelect={false} </div>
initialSelectedItemIds={initialSelectedItemIds} </div>
onSelectItemsChange={handleSelectItems} )}
/> {!isLoading && (
)} <TreeView
data={treeData}
multiple
expandAll
clickRowToSelect={false}
initialSelectedItemIds={initialSelectedItemIds}
onSelectItemsChange={handleSelectItems}
/>
)}
</ScrollArea>
</div> </div>
<DialogFooter> <DialogFooter>