fix(documents): reset type filter on tab/folder switch + label chips
Switching tab or folder while a type filter was active left the filter applied silently — the chip cloud regenerated from the new result set so no chip lit up, but the documentType= query param kept narrowing the list. Reset typeFilter to undefined whenever tab or selected folder changes. Also use TYPE_LABELS for chip text so the filter chips match the human-readable labels already shown in the row's Type column. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -211,22 +211,27 @@ export function DocumentsHub({ portSlug, initialTab = 'all' }: DocumentsHubProps
|
||||
);
|
||||
};
|
||||
|
||||
const handleFolderSelect = (id: string | null | undefined) => {
|
||||
setSelectedFolderId(id);
|
||||
setTypeFilter(undefined);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-col sm:flex-row h-full">
|
||||
<FolderTreeSidebar
|
||||
selectedFolderId={selectedFolderId}
|
||||
onSelect={setSelectedFolderId}
|
||||
onSelect={handleFolderSelect}
|
||||
footer={
|
||||
<PermissionGate resource="documents" action="manage_folders">
|
||||
<FolderActionsMenu
|
||||
selectedFolderId={selectedFolderId}
|
||||
onAfterDelete={() => setSelectedFolderId(undefined)}
|
||||
onAfterDelete={() => handleFolderSelect(undefined)}
|
||||
/>
|
||||
</PermissionGate>
|
||||
}
|
||||
/>
|
||||
<div className="flex-1 min-w-0 p-4 space-y-4">
|
||||
<FolderBreadcrumb selectedFolderId={selectedFolderId} onSelect={setSelectedFolderId} />
|
||||
<FolderBreadcrumb selectedFolderId={selectedFolderId} onSelect={handleFolderSelect} />
|
||||
|
||||
<PageHeader
|
||||
title="Documents"
|
||||
@@ -262,7 +267,13 @@ export function DocumentsHub({ portSlug, initialTab = 'all' }: DocumentsHubProps
|
||||
variant="gradient"
|
||||
/>
|
||||
|
||||
<Tabs value={tab} onValueChange={(v) => setTab(v as DocumentsHubTab)}>
|
||||
<Tabs
|
||||
value={tab}
|
||||
onValueChange={(v) => {
|
||||
setTab(v as DocumentsHubTab);
|
||||
setTypeFilter(undefined);
|
||||
}}
|
||||
>
|
||||
<TabsList>
|
||||
{documentsHubTabs.map((t) => (
|
||||
<TabsTrigger key={t} value={t}>
|
||||
@@ -285,9 +296,7 @@ export function DocumentsHub({ portSlug, initialTab = 'all' }: DocumentsHubProps
|
||||
className="max-w-xs h-9"
|
||||
/>
|
||||
{(() => {
|
||||
const seenTypes = Array.from(
|
||||
new Set(documents.map((d) => d.documentType)),
|
||||
).sort();
|
||||
const seenTypes = Array.from(new Set(documents.map((d) => d.documentType))).sort();
|
||||
if (seenTypes.length === 0) return null;
|
||||
return (
|
||||
<div className="flex flex-wrap gap-1.5">
|
||||
@@ -311,7 +320,7 @@ export function DocumentsHub({ portSlug, initialTab = 'all' }: DocumentsHubProps
|
||||
)}
|
||||
onClick={() => setTypeFilter(t)}
|
||||
>
|
||||
{t}
|
||||
{TYPE_LABELS[t] ?? t}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user