Skip to content

feat(resources): add sort and filter to all resource list pages#3834

Open
waleedlatif1 wants to merge 27 commits intostagingfrom
feat/table-filtering
Open

feat(resources): add sort and filter to all resource list pages#3834
waleedlatif1 wants to merge 27 commits intostagingfrom
feat/table-filtering

Conversation

@waleedlatif1
Copy link
Copy Markdown
Collaborator

@waleedlatif1 waleedlatif1 commented Mar 29, 2026

Summary

  • Add sort and multi-select filter to KB list, Files, Tables, and Scheduled Tasks list pages
  • Add sort to Logs page (client-side over paginated data)
  • Add sort to Recently Deleted page
  • Upgrade all filter panels to Combobox-based UI (consistent with logs) supporting multi-select
  • Add member-based "Uploaded by" / "Owner" filter to Files and Tables using workspace member data with avatars
  • Add additional filter dimensions: file type, size, schedule type, health, row count, column type
  • Upgrade KB Documents and Document Chunks filter panels to Combobox style
  • Fix filter popover inheriting anchor min-width (added `w-fit` to Radix popover content)
  • Fix build: add missing `Combobox` and `SortConfig` imports in `files.tsx` and `document.tsx`
  • Fix stale `logs` refs in sort-related callbacks and dependency arrays
  • Wrap `sortConfig`, `filterTags`, `enabledFilterParam` in `useMemo` consistently across all pages
  • Fix missing `uploadFile`/`uploadCsv` in useCallback dependency arrays

Type of Change

  • New feature

Testing

Tested manually

Checklist

  • Code follows project style guidelines
  • Self-reviewed my changes
  • Tests added/updated and passing
  • No new warnings introduced
  • I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

- Replace popover filter with persistent inline panel below toolbar
- Add AND/OR toggle between filter rules (shown in Where label slot)
- Sync filter panel state from applied filter on open
- Show filter button active state when filter is applied or panel is open
- Use readable operator labels matching dropdown options
- Add Clear filters button (shown only when filter is active)
- Close filter panel when last rule is removed via X
- Fix empty gap rows appearing in filtered results by skipping position gap rendering when filter is active
- Add toggle mode to ResourceOptionsBar for inline panel pattern
- Memoize FilterRuleRow for perf, fix filterTags key collision, remove dead filterActiveCount prop
@vercel
Copy link
Copy Markdown

vercel bot commented Mar 29, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment
Project Deployment Actions Updated (UTC)
docs Skipped Skipped Mar 29, 2026 3:57am

Request Review

@cursor
Copy link
Copy Markdown

cursor bot commented Mar 29, 2026

PR Summary

Medium Risk
Touches multiple workspace list pages and changes client-side filtering/sorting behavior (including logs and tables), which could impact UX consistency and performance on large datasets, but stays UI-side with no auth/data-write logic changes.

Overview
Adds consistent client-side sorting and multi-select, Combobox-based filtering to resource list pages (Files, Tables, Knowledge Bases, Scheduled Tasks) and extends Knowledge Base document/chunk status filters to support multi-select with filter tags and clear actions.

Updates ResourceOptionsBar to support a toggle-style filter button (onFilterToggle/filterActive), improve active-state styling for sort/filter, truncate long filter tags, and fix popover sizing (w-fit). Applies new sort to Logs (sorting the currently loaded paginated data) and adds a sort dropdown to Recently Deleted.

Tables get an updated filter UX: the filter button toggles an inline TableFilter panel that can clear/close, supports AND/OR rule toggling, and the table UI refines column drag/drop with a dedicated drag handle and global drop indicator; row gap rendering is disabled when filters are active.

Written by Cursor Bugbot for commit c8672f7. Configure here.

@greptile-apps
Copy link
Copy Markdown
Contributor

greptile-apps bot commented Mar 29, 2026

Greptile Summary

This PR adds consistent sort and multi-select filter capabilities to all resource list pages (Knowledge Bases, Files, Tables, Scheduled Tasks, Logs, Recently Deleted, KB Documents, and Document Chunks). The architecture shifts from server/table-internal defaultSort/sortValues to explicit client-side sort logic inside each page's data-processing useMemo, with a shared SortConfig driving the ResourceOptionsBar sort dropdown.

Key changes:

  • All list pages now derive a sorted + filtered array via a single processedItems/filteredItems useMemo, replacing the previous sortValues mechanism in ResourceRow.
  • Filter panels upgraded to Combobox multi-select with FilterTag badge removal; member-avatar options for owner/uploader filters in Files, Tables, and Knowledge.
  • ResourceOptionsBar gains a toggle-mode filter button (onFilterToggle/filterActive) for the table filter panel, and the popover content is now w-fit to fix width inheritance from the trigger.
  • SearchSection simplified by removing redundant local state — debouncing moved cleanly to the parent via useDebounce.
  • table-filter.tsx: filter rules now initialize from the existing filter prop via filterToRules, logical operator toggle added per rule, and FilterRuleRow converted to memo() with stable callbacks.
  • table.tsx: column drag migrated to an explicit GripVertical handle, drop indicator moved to a global overlay div, and gap rows suppressed when a filter is active.
  • Stale logs / uploadFile / uploadCsv refs in dependency arrays fixed throughout.

Confidence Score: 5/5

Safe to merge — all remaining findings are P2 style/polish items with no data-integrity or runtime risk.

The PR is a large but well-structured feature addition. The core sort/filter logic is correct, dependency arrays are properly fixed, and the previous FilterRuleRow memoization issue has been addressed. The three open findings are: an unconditional draggable attribute that may allow drag-ghost in read-only mode (no data impact), a hardcoded '2 selected' string in a 2-option filter (cosmetic), and a dead 'updated' case in the files sort switch (dead code). None of these block correct functionality.

table/table.tsx (drag handle readOnly check), knowledge/[id]/base.tsx (hardcoded display label), files/files.tsx (dead sort case)

Important Files Changed

Filename Overview
apps/sim/app/workspace/[workspaceId]/components/resource/components/resource-options-bar/resource-options-bar.tsx Refactored to support toggle-mode filter button; simplified SearchSection by removing redundant local state; added active-state styling; fixed popover w-fit.
apps/sim/app/workspace/[workspaceId]/files/files.tsx Adds client-side sort and multi-select filters; replaces manual debounce with useDebounce; fixes missing uploadFile dep; dead 'updated' sort case.
apps/sim/app/workspace/[workspaceId]/knowledge/knowledge.tsx Adds client-side sort and multi-select filters with member avatars; replaces manual debounce; wraps sortConfig/filterTags in useMemo.
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/base.tsx Upgrades status filter to multi-select; derives enabledFilterParam via useMemo; hardcoded '2 selected' label instead of dynamic count.
apps/sim/app/workspace/[workspaceId]/knowledge/[id]/[documentId]/document.tsx Adds per-page client-side sort for chunks; upgrades status filter to Combobox; wraps filterTags in useMemo.
apps/sim/app/workspace/[workspaceId]/logs/logs.tsx Adds client-side sort over all loaded pages; fixes stale logs refs by using sortedLogs throughout; wraps sortConfig in useMemo.
apps/sim/app/workspace/[workspaceId]/scheduled-tasks/scheduled-tasks.tsx Adds client-side sort and multi-select filters; replaces defaultSort/sortValues with SortConfig; filter and sort logic cleanly in filteredItems memo.
apps/sim/app/workspace/[workspaceId]/settings/components/recently-deleted/recently-deleted.tsx Adds Combobox-based sort in toolbar; moves sorting into filtered memo; search bar layout adjusted.
apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table-filter/table-filter.tsx Initializes rules from filter prop via filterToRules; adds logical operator toggle; adds Clear button; FilterRuleRow converted to memo().
apps/sim/app/workspace/[workspaceId]/tables/[tableId]/components/table/table.tsx Moves filter panel to inline conditional render; adds GripVertical drag handle; drag handle draggable doesn't check readOnly.
apps/sim/app/workspace/[workspaceId]/tables/tables.tsx Adds client-side sort and multi-select filters; fixes missing uploadCsv dep; removes sortValues from rows.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[User Input] --> B[Search Input]
    A --> C[Filter Comboboxes]
    A --> D[Sort Dropdown]
    B --> E[useDebounce 200-300ms]
    C --> F[Filter State arrays]
    D --> G[activeSort]
    E --> H[processedItems useMemo]
    F --> H
    G --> H
    H --> I[Text search]
    I --> J[Dimension filters]
    J --> K[Client-side sort]
    K --> L[rows useMemo ResourceRow]
    L --> M[Resource Component]
Loading

Reviews (3): Last reviewed commit: "fix(resources): fix filter/sort correctn..." | Re-trigger Greptile

…backs

Reading rules via ref instead of closure eliminates rules from useCallback
dependency arrays, keeping callbacks stable across rule edits and preserving
the memo() benefit on FilterRuleRow.
…width

- Remove non-TSDoc comment from table-filter (rulesRef pattern is self-evident)
- Simplify SearchSection: remove setState-during-render anti-pattern; controlled
  input binds directly to search.value/onChange (simpler and correct)
- Reduce KB filter popover from w-[320px] to w-[200px]; tag filter uses vertical
  layout so narrow width works; Status-only case is now appropriately compact
@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@greptile

@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@cursor review

Sort dropdown: name, documents, tokens, created, last updated — pre-sorted
externally before passing rows to Resource. Active sort highlights the Sort
button; clear resets to default (created desc).

Filter popover: filter by connector status (All / With connectors /
Without connectors). Active filter shown as a removable tag in the toolbar.
…e hook and use type guards for file filtering
Replaces button-list filters with Combobox-based multi-select sections for file type, size, and uploaded-by filters, aligning the panel with the logs page filter UI.
Add a sort dropdown next to the search bar allowing users to sort by deletion date (default, newest first), name (A–Z), or type (A–Z).
@waleedlatif1 waleedlatif1 changed the title improvement(tables): improve table filtering UX feat(resources): add sort and filter to all resource list pages Mar 29, 2026
@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@cursor review

@waleedlatif1
Copy link
Copy Markdown
Collaborator Author

@greptile

Copy link
Copy Markdown

@cursor cursor bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 1 potential issue.

Fix All in Cursor

Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Chunk sort was previously done client-side on a single page of
server-paginated data, which only reordered the current page.
Now sort params (sortBy, sortOrder) flow through the full stack:
types → service → API route → query hook → useDocumentChunks → document.tsx.
Resource is wrapped in React.memo, so an unstable filterContent reference
on every parent re-render defeats the memo. Wrap filterContent in useMemo
with correct deps in all 6 pages (files, tables, scheduled-tasks, knowledge,
base, document).
Every column visible in a resource table should be sortable. Three pages
had visible columns with no sort support:
- files.tsx: add 'owner' sort (member name lookup)
- scheduled-tasks.tsx: add 'schedule' sort (localeCompare on description)
- knowledge.tsx: add 'connectors' (count) and 'owner' (member name) sorts

Also add 'members' to processedKBs deps in knowledge.tsx since owner
sort now reads member names inside the memo.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant