feat(favorites): add folder item limit and folder picker for organizi…#45
Merged
creatorcluster merged 2 commits intocreatorcluster:mainfrom Mar 1, 2026
Merged
feat(favorites): add folder item limit and folder picker for organizi…#45creatorcluster merged 2 commits intocreatorcluster:mainfrom
creatorcluster merged 2 commits intocreatorcluster:mainfrom
Conversation
…ng favorites Add MAX_FOLDER_ITEMS constant (40) to enforce folder capacity limits. Implement visual indicators showing folder item counts with warning icons when folders are full. Add FolderPickerPopover component to allow users to select a folder when favoriting a resource. Block drag operations and folder assignments when limits are reached with user-friendly error messages.
|
@Coder-soft is attempting to deploy a commit to the yamura3's projects Team on Vercel. A member of the Team first needs to authorize it. |
|
Caution Review failedThe pull request is closed. ℹ️ Recent review infoConfiguration used: Organization UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (6)
📝 WalkthroughWalkthroughThis pull request introduces folder capacity management for favorites, adding a 40-item limit per folder (MAX_FOLDER_ITEMS). It includes a new FolderPickerPopover component for selecting or creating folders when favoriting resources, displays folder item counts and capacity alerts in the sidebar, and enforces capacity checks during drag-drop and folder assignment operations. The toggleHeart hook method now returns a Promise to support asynchronous folder-picker workflows. Changes
Sequence DiagramsequenceDiagram
actor User
participant ResourceCard
participant useHeartedResources
participant FolderPickerPopover
participant useUserFavorites
participant Database
User->>ResourceCard: Click heart icon
activate ResourceCard
ResourceCard->>useHeartedResources: toggleHeart(resource)
activate useHeartedResources
useHeartedResources->>useUserFavorites: toggleFavorite(resourceUrl)
activate useUserFavorites
useUserFavorites->>Database: Add to favorites
Database-->>useUserFavorites: Success, returns action: 'added'
useUserFavorites-->>useHeartedResources: Promise resolves
deactivate useUserFavorites
useHeartedResources-->>ResourceCard: Promise resolves
deactivate useHeartedResources
alt Folders exist
ResourceCard->>ResourceCard: setShowFolderPicker(true)
ResourceCard->>FolderPickerPopover: Open picker anchored to heart button
activate FolderPickerPopover
User->>FolderPickerPopover: Select folder
FolderPickerPopover->>useUserFavorites: getFolderItemCount(folderId)
useUserFavorites-->>FolderPickerPopover: Item count < MAX_FOLDER_ITEMS?
alt Folder has capacity
FolderPickerPopover->>useHeartedResources: handleFolderSelect(folderId)
useHeartedResources->>useUserFavorites: addFavoriteToFolder(resourceUrl, folderId)
activate useUserFavorites
useUserFavorites->>Database: Update favorite with folder_id
Database-->>useUserFavorites: Success
deactivate useUserFavorites
FolderPickerPopover->>ResourceCard: Close picker
deactivate FolderPickerPopover
else Folder is full
FolderPickerPopover->>User: Show disabled state for folder
end
end
deactivate ResourceCard
Estimated code review effort🎯 4 (Complex) | ⏱️ ~75 minutes Possibly related PRs
Poem
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
Greptile SummaryAdded 40-item folder capacity limits with visual indicators and enforcement across the favorites system. Implemented Key changes:
Issues found:
Confidence Score: 3/5
|
| Filename | Overview |
|---|---|
| src/components/resources/FavoritesSidebar.tsx | Added folder item count display with warning indicators, but child folders hardcoded to show 0 items (line 145) |
| src/components/resources/FavoritesTab.tsx | Added folder capacity validation for drag-and-drop operations with user-friendly error messages |
| src/components/resources/FolderPickerPopover.tsx | New component for folder selection when favoriting, only shows root folders (excludes nested folders), minor positioning inconsistency |
| src/components/resources/ResourceCard.tsx | Integrated folder picker popover that appears after favoriting when folders exist |
| src/hooks/useHeartedResources.ts | Updated to expose folder-related methods and changed toggleHeart to return Promise with action type |
| src/hooks/useUserFavorites.ts | Added MAX_FOLDER_ITEMS constant and folder capacity validation, potential race condition in count checks, TypeScript suppression |
Flowchart
%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[User clicks heart on ResourceCard] --> B{toggleHeart}
B --> C{Added or Removed?}
C -->|Removed| D[Remove from favorites]
C -->|Added| E{Folders exist?}
E -->|No| F[Add to favorites without folder]
E -->|Yes| G[Show FolderPickerPopover]
G --> H{User selects folder}
H -->|No folder| I[Add without folder_id]
H -->|Select folder| J{Check folder count}
J -->|Full| K[Block & show error]
J -->|Available space| L[addFavoriteToFolder]
L --> M[Update DB with folder_id]
N[User drags resource to folder] --> O{Check folder count}
O -->|Full| P[Block drag & toast error]
O -->|Available space| Q[moveFavorite]
Q --> R[Update folder_id in DB]
S[FavoritesSidebar renders] --> T[getFolderItemCount]
T --> U{Count >= 40?}
U -->|Yes| V[Show warning icon]
U -->|No| W[Show normal count]
Last reviewed commit: eb22bbe
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| onDelete={onDelete} | ||
| onDownload={onDownload} | ||
| getChildren={getChildren} | ||
| folderItemCount={0} |
There was a problem hiding this comment.
child folders always show 0/40 regardless of actual item count
Suggested change
| folderItemCount={0} | |
| folderItemCount={getFolderItemCount(child.id)} |
|
|
||
| if (!isOpen) return null; | ||
|
|
||
| const rootFolders = folders.filter(f => !f.parent_id); |
There was a problem hiding this comment.
only root folders are shown in picker - nested folders can't be selected when favoriting a resource
Comment on lines
+94
to
+98
| // Check folder limit | ||
| const folderCount = favoritesData.filter(f => f.folder_id === folderId).length; | ||
| if (folderCount >= MAX_FOLDER_ITEMS) { | ||
| throw new Error('FOLDER_FULL'); | ||
| } |
There was a problem hiding this comment.
race condition: favoritesData could be stale between count check and DB operation, allowing folder limit to be exceeded by concurrent requests
|
|
||
| const { error } = await supabase | ||
| .from('user_favorites') | ||
| // @ts-ignore -- folder_id column exists in DB but generated types are stale |
There was a problem hiding this comment.
regenerate types instead of suppressing TypeScript warnings
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Comment on lines
+40
to
+41
| const popoverWidth = 220; | ||
| const popoverHeight = 300; |
There was a problem hiding this comment.
popoverHeight is 300 but maxHeight on line 132 is 340 - inconsistent values may cause positioning issues
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
…ng favorites
Add MAX_FOLDER_ITEMS constant (40) to enforce folder capacity limits. Implement visual indicators showing folder item counts with warning icons when folders are full. Add FolderPickerPopover component to allow users to select a folder when favoriting a resource. Block drag operations and folder assignments when limits are reached with user-friendly error messages.
Summary by CodeRabbit
New Features