feat(EntityGrid): implement infinite scroll for entity lists
Add infinite scroll functionality to EntityGrid component using VueUse's useInfiniteScroll composable to handle large volumes of entities efficiently. Changes: - Integrate @vueuse/core useInfiniteScroll composable - Add infinite scroll state management (displayedCount, reset function) - Configure initial batch size (20 items) and increment size (20 items) - Update displayedEntities, alphabeticalContacts to support progressive loading - Add canLoadMore() logic for people, projects, and search modes - Reset scroll state when search term or entities prop changes - Remove maxItems prop (replaced by infinite scroll) - Simplify displayEntitiesFunction signature (removed maxItems parameter) - Update EntitySelectionStep and test files to remove max-items prop Technical details: - Uses template ref (scrollContainer) to access scrollable container - Recent contacts (3) count toward initial batch for people grid - Special entities (You, Unnamed) always displayed, don't count toward limits - Infinite scroll works for both entity types and search results - Constants are configurable at top of component (INITIAL_BATCH_SIZE, INCREMENT_SIZE) This improves performance and UX when displaying large lists of contacts or projects by loading content progressively as users scroll.
This commit is contained in:
@@ -15,7 +15,6 @@ properties * * @author Matthew Raymer */
|
||||
<EntityGrid
|
||||
:entity-type="shouldShowProjects ? 'projects' : 'people'"
|
||||
:entities="shouldShowProjects ? projects : allContacts"
|
||||
:max-items="10"
|
||||
:active-did="activeDid"
|
||||
:all-my-dids="allMyDids"
|
||||
:all-contacts="allContacts"
|
||||
|
||||
Reference in New Issue
Block a user