Feat etp 68 task web performance optimization for user profile task component #3966
Conversation
WalkthroughThis change refactors dynamic imports across the codebase, consolidating lazy-loaded components into centralized "optimized-components" modules for each domain (tasks, dashboard, kanban, calendar, etc.). It introduces virtualization and memoization for large lists, adds shared and enhanced caching hooks, replaces Headless UI Tabs with Radix UI-based tabs, and updates related UI and skeleton components. No exported entity signatures are removed; new hooks, constants, and components are added. Changes
Sequence Diagram(s)sequenceDiagram
participant Page
participant OptimizedComponents
participant Suspense
participant LazyComponent
participant Skeleton
Page->>OptimizedComponents: import { LazyComponent }
Page->>Suspense: Render <Suspense fallback=Skeleton>
Suspense->>LazyComponent: Render LazyComponent
alt Component loading
LazyComponent->>Skeleton: Show loading skeleton
else Component loaded
LazyComponent->>Page: Render actual component
end
sequenceDiagram
participant TaskList
participant VirtualizedList
participant SharedCache
participant RenderItem
TaskList->>VirtualizedList: Render with tasks, virtualization enabled
VirtualizedList->>SharedCache: Check for cached rendered items
alt Cache hit
SharedCache->>VirtualizedList: Return cached React nodes
else Cache miss
VirtualizedList->>RenderItem: Render item
RenderItem->>SharedCache: Store rendered node in cache
end
VirtualizedList->>TaskList: Render visible items
Estimated code review effort🎯 5 (Critical) | ⏱️ ~90 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Note ⚡️ Unit Test Generation is now available in beta!Learn more here, or try it out under "Finishing Touches" below. ✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
Please review these files and clean up the unused code. |
Please review these files and clean up the unused code. |
- Enhanced the UserProfileTask component by introducing a new TaskList subcomponent to reduce re-renders and improve performance. - Implemented memoization techniques to optimize task filtering and badge class name calculations. - Updated the useScrollPagination hook to handle item initialization and scrolling more efficiently, ensuring smoother user experience during pagination.
…n and memoization - Introduced advanced memoization techniques for task filtering to optimize performance. - Implemented TanStack Virtual for efficient rendering of large task lists, improving responsiveness. - Updated the UserProfileTask component to support virtualization and dynamic task updates. - Added a new useMemoizedCache hook for better cache management in task filtering operations.
… performance - Optimized task filtering logic with intelligent caching and memoization techniques. - Implemented window-based virtualization for large task lists to enhance rendering performance. - Updated UserProfileTask and UserTeamCard components to support new virtualization features. - Enhanced useTaskVirtualization hook to automatically choose between container and window virtualization based on task count.
…mponent - Adjusted the height property of the scrolling indicator for better visual consistency. - Maintained existing styles while enhancing the overall appearance in dark mode.
…r team card - Added ITEMS_LENGTH_TO_VIRTUALIZED constant to define the threshold for enabling virtualization in task lists. - Updated UserTeamCard component to utilize the new constant for improved maintainability and clarity in virtualization logic.
- Updated DailyPlanTaskInfoCell to adjust task info cell width for better layout. - Enhanced UserProfilePlans component to implement loading state logic, ensuring daily plans display correctly during data fetching. - Fixed synchronization issue in useDailyPlan hook by changing the dependency to prevent premature empty state. - Improved task filtering logic in useTaskFilter to correctly extract tasks from daily plans, enabling full functionality in the task filter system.
…yout improvements - Integrated delete plan functionality into the PlanHeader component for better user experience. - Updated layout logic to conditionally display the delete button based on user permissions and plan mode. - Refactored task time calculations for improved readability and performance. - Enhanced task filtering and display logic in the FutureTasks and OutstandingFilterDate components to align with new header features.
…nent - Introduced useMemo and useCallback for improved performance in the OutstandingFilterDate component. - Created optimized style objects and rendering functions to reduce unnecessary re-renders. - Simplified task rendering logic by extracting it into a dedicated function, enhancing code readability and maintainability. - Adjusted styles in the SelectComponent for better layout consistency.
- Added taskContentClassName to AllPlans, FutureTasks, and PastTasks components to standardize task content width. - Enhanced layout consistency across daily plan components for improved user experience.
- Updated taskContentClassName in AllPlans, FutureTasks, and PastTasks components for standardized card width. - Improved layout consistency across daily plan components to enhance user experience. - Refactored UserTeamActivity component for better alignment and spacing in the activity display.
- Enhanced UserWorkedTaskTab component to support virtualization for improved performance with large task lists. - Introduced VirtualizedList component to handle rendering of tasks efficiently, reducing re-renders and optimizing memory usage. - Added logic to conditionally use virtualization based on task count, improving user experience during task navigation. - Updated task rendering logic to maintain layout consistency while leveraging virtualization features.
…d VirtualizedList - Updated UserWorkedTaskTab to improve task rendering with a larger buffer size and enhanced scrolling indicator for better user experience. - Refactored VirtualizedList to utilize dynamic configuration for cache size and overscan multiplier, optimizing performance for varying list sizes. - Introduced adaptive buffer zones that respond to scroll speed, reducing white space and improving visual continuity during scrolling. - Preserved original spacing structure in rendered items to maintain layout consistency across components.
…zedList performance - Introduced a shared virtualization cache to improve performance across multiple instances of VirtualizedList, allowing for efficient data retrieval and rendering. - Enhanced VirtualizedList to support dynamic pagination for large datasets, optimizing rendering based on item count and scroll direction. - Implemented debounced cache warming and improved buffer zone calculations to reduce visual artifacts during scrolling. - Updated virtualization configuration to adaptively manage cache size and overscan multiplier, enhancing user experience with large lists.
…orkedTaskTab - Updated UserWorkedTaskTab to utilize LazyTaskCard for improved performance and reduced initial load time. - Implemented memoization techniques with useCallback and useMemo to optimize rendering and prevent unnecessary re-renders. - Added LazyUserWorkedTaskTab for dynamic import of user tasks, enhancing user experience with lazy loading. - Introduced TaskCardBlockSKeleton for consistent loading states across task components. - Refactored VirtualizedList to support flexible renderItem signatures, improving compatibility with various item rendering functions.
…ton support - Introduced LazyUserTeamActivity for dynamic import, enhancing performance by reducing initial load time. - Added UserTeamActivitySkeleton for consistent loading states while the component is being fetched. - Updated UserTeamCard to utilize LazyUserTeamActivity, improving user experience with lazy loading. - Refactored imports in user-team-card-activity to streamline component usage.
…rmance - Added new optimized components for lazy loading, consolidating imports for better performance across various pages. - Replaced direct dynamic imports with centralized imports from optimized-components, enhancing code maintainability. - Introduced new Tabs component for improved tabbed navigation in UserTeamActivity, streamlining the user interface. - Updated package.json to include @radix-ui/react-tabs for tab functionality.
…rmance - Consolidated dynamic imports into centralized optimized components for improved performance across various pages. - Replaced direct dynamic imports with imports from optimized-components, enhancing code maintainability and reducing initial load times. - Updated multiple components including calendar, dashboard, kanban, reports, and settings to utilize the new optimized imports. - Improved user experience by ensuring consistent loading states through skeleton components.
- Updated AccordionContent styles in AllPlans, FutureTasks, OutstandingFilterDate, and PastTasks components to include consistent padding and background color. - Improved visual consistency across daily plan components, enhancing overall user experience.
699e6bb to
3b44e96
Compare
Please review these files and clean up the unused code. |
Please review these files and clean up the unused code. |
…ponent imports - Updated page-component to utilize lazy loading for various team-related components, enhancing performance and reducing initial load times. - Consolidated imports from optimized-components, improving code maintainability and ensuring consistent loading states with skeleton components. - Removed deprecated optimized-components file to streamline the codebase.
Please review these files and clean up the unused code. |
There was a problem hiding this comment.
Greptile Summary
This PR implements a comprehensive performance optimization for the UserProfileTask component through systematic architectural improvements. The changes introduce a centralized lazy loading system where all dynamic imports are consolidated into domain-specific optimized-components modules (tasks, teams, dashboard, etc.), replacing scattered inline dynamic imports throughout the codebase. The optimization includes advanced virtualization using TanStack Virtual for lists exceeding 25 items, intelligent caching mechanisms with LRU eviction and TTL support, and React performance optimizations through memoization, deferred updates, and component splitting.
Key architectural changes include:
- Centralized Component Loading: All lazy-loaded components moved from inline
dynamic()imports to organized modules under@/core/components/optimized-components/ - Virtualization Infrastructure: New hooks
useTanStackVirtual,useEnhancedVirtualizationwith smart caching and scroll direction tracking - Performance Hooks: Custom caching systems (
useMemoizedCache,useSharedVirtualizationCache) for expensive operations - Component Optimization: TaskCard replaced with LazyTaskCard across the codebase, React.memo wrapper additions, and consistent card width styling
- Data Flow Improvements: Fixed daily plan synchronization bugs and loading state handling
The refactoring maintains backward compatibility while introducing conditional virtualization based on the ITEMS_LENGTH_TO_VIRTUALIZED constant (25 items). The optimization specifically targets scenarios where users expand team member cards and scroll through large task lists, addressing performance bottlenecks through code splitting, intelligent rendering, and memory management.
Confidence score: 3/5
- This PR introduces significant architectural changes that could cause performance regressions or functionality issues if not properly tested.
- Several concerning patterns including memory leak risks from global intervals, type safety issues with 'any' usage, complex caching logic using JSON.stringify operations, and potential race conditions in the multiple useEffect hooks.
- Files with critical issues:
apps/web/core/components/tasks/daily-plan/outstanding-date.tsx(broken drag-and-drop),apps/web/core/hooks/common/use-shared-virtualization-cache.ts(memory leaks),apps/web/core/components/pages/profile/user-profile-tasks.tsx(performance-heavy JSON operations), andapps/web/core/components/daily-plan/all-plans.tsx(duplicate useEffect hooks).
70 files reviewed, 28 comments
apps/web/core/components/common/skeleton/profile-component-skeletons.tsx
Outdated
Show resolved
Hide resolved
apps/web/app/[locale]/(main)/dashboard/team-dashboard/[teamId]/page.tsx
Outdated
Show resolved
Hide resolved
There was a problem hiding this comment.
Actionable comments posted: 16
🔭 Outside diff range comments (1)
apps/web/core/constants/config/constants.tsx (1)
1-781: Remove unused exports in constants.tsxKnip has identified the following exports in
apps/web/core/constants/config/constants.tsxas unreferenced across theapps/webworkspace. Please remove these to resolve the pipeline error and keep the codebase clean:
- ROLES (line 31)
- PERMISSION_ROLES (line 81)
- LOG_FOLDER_MAX_SIZE (line 141)
- GA_MEASUREMENT_ID (line 151)
- SMTP_FROM_ADDRESS (line 162)
- SMTP_HOST (line 163)
- SMTP_PORT (line 164)
- SMTP_SECURE (line 165)
- APP_SLOGAN_TEXT (line 179)
- jitsuConfiguration (line 238)
- APPLICATION_LANGUAGES (line 255)
- DEFAULT_CURRENCIES (line 447)
After removal, run the Knip check again to confirm no unused exports remain.
🧹 Nitpick comments (24)
apps/web/core/hooks/common/use-shared-virtualization-cache.ts (1)
101-116: Consider optimizing LRU eviction for better performanceThe current implementation has O(n) complexity for finding the LRU item. For better performance with larger cache sizes, consider implementing a proper LRU cache with a doubly-linked list.
For now, the implementation is acceptable given the default max size of 200 items. If performance becomes an issue, consider using a library like
lru-cacheor implementing a doubly-linked list + map structure for O(1) eviction.apps/web/core/components/optimized-components/index.tsx (2)
1-34: Prefer.tsover.tsxfor non-JSX barrelsThe file only re-exports modules and contains no JSX. Renaming it to
index.tsavoids an unnecessary React transform step and shaves a few bytes from every build.-// apps/web/core/components/optimized-components/index.tsx +// apps/web/core/components/optimized-components/index.ts
3-34: Barrel export may hinder tree-shaking – consider explicit sub-paths
export *re-exports everything from each domain file. When consumers doimport { LazyProductivityChart } from '@/core/components/optimized-components';they pull the full barrel, which can prevent dead-code-elimination of unrelated lazy components. Importing directly from e.g.
optimized-components/dashboardkeeps bundles smaller:import { LazyProductivityChart } from '@/core/components/optimized-components/dashboard';Not blocking, but worth weighing against bundle size goals.
apps/web/app/[locale]/(main)/dashboard/app-url/[teamId]/page.tsx (1)
35-40: Import from the dashboard sub-module to keep the barrel tree-shakableUsing the top-level barrel pulls in all optimized components. Narrow the path so only dashboard artefacts are evaluated by the bundler:
-import { - LazyProductivityChart, - LazyProductivityHeader, - LazyProductivityStats -} from '@/core/components/optimized-components'; +import { + LazyProductivityChart, + LazyProductivityHeader, + LazyProductivityStats +} from '@/core/components/optimized-components/dashboard';This is consistent with the path used in other updated files (e.g.
task-timer-section.tsx).apps/web/core/components/pages/dashboard/task-timer-section.tsx (1)
5-5: Use the alias path for consistencyElsewhere we import the same helpers through
'@/core/components/optimized-components/dashboard'. Switching to the alias keeps imports uniform and avoids accidental relative-path breakage during refactors.-import { LazyTimer, LazyAuthUserTaskInput } from '../../optimized-components/dashboard'; +import { LazyTimer, LazyAuthUserTaskInput } from '@/core/components/optimized-components/dashboard';apps/web/app/[locale]/(main)/task/[id]/page.tsx (1)
20-22: Use task sub-module instead of the full barrelPulling from the root barrel imports every optimized component. Limiting the path keeps bundles lean:
-import { LazyTaskDetailsComponent } from '@/core/components/optimized-components'; +import { LazyTaskDetailsComponent } from '@/core/components/optimized-components/tasks';apps/web/core/components/optimized-components/meet.tsx (1)
3-20: Consider making the loading stub height responsiveHard-coding a fixed height of
h-96(≈ 24 rem) for the loading fallback can introduce unnecessary vertical whitespace on small screens and produce CLS when the real component height differs.A simple tweak keeps the nice centred loader while letting the parent decide the vertical space:
- <div className="flex items-center justify-center h-96"> + <div className="flex items-center justify-center min-h-[16rem] sm:min-h-[24rem]">This keeps the intent but is more adaptive.
apps/web/core/components/layouts/app-sidebar.tsx (1)
350-352: Suspense fallback could reuse existing skeletonTiny thought: you already import
ModalSkeleton; using the same component here would give a consistent look instead of the grey pulse div.-fallback={<div className="h-8 bg-[#F0F0F0] dark:bg-[#353741] animate-pulse rounded-md" />} +fallback={<ModalSkeleton size="sm" />}apps/web/core/components/optimized-components/projects.tsx (1)
1-73: Well-structured centralized lazy loading module.This module effectively consolidates project-related dynamic imports with consistent patterns:
Strengths:
- Clear organization with logical groupings (modals, views, export)
- Appropriate SSR disabling for client-side components
- Consistent loading skeleton implementations for main views
- Proper handling of conditional modals without loading UI
Minor suggestion: Consider standardizing the loading skeleton designs across similar components to maintain visual consistency.
apps/web/core/components/optimized-components/reports.tsx (2)
2-5: Consider using proper skeleton components for consistency.The commented imports suggest there are dedicated skeleton components available. Consider using these instead of simple div placeholders for better loading UX consistency across the application.
-// import { GroupBySelectSkeleton } from '../common/skeleton/group-by-select-skeleton'; -// import { WeeklyLimitExportMenuSkeleton } from '../common/skeleton/weekly-limit-export-menu-skeleton'; -// import { TimeReportTableSkeleton } from '../common/skeleton/time-report-table-skeleton'; +import { GroupBySelectSkeleton } from '../common/skeleton/group-by-select-skeleton'; +import { WeeklyLimitExportMenuSkeleton } from '../common/skeleton/weekly-limit-export-menu-skeleton'; +import { TimeReportTableSkeleton } from '../common/skeleton/time-report-table-skeleton';
52-58: Add loading placeholders for consistency.Components
LazyCardTimeAndActivityandLazyActivityTablelack loading placeholders while others have them. Consider adding appropriate skeletons for consistent loading experience.export const LazyCardTimeAndActivity = dynamic(() => import('../pages/time-and-activity/card-time-and-activity'), { - ssr: false + ssr: false, + loading: () => <div className="w-full h-32 bg-[#F0F0F0] dark:bg-[#353741] animate-pulse rounded" /> }); export const LazyActivityTable = dynamic(() => import('../pages/time-and-activity/activity-table'), { - ssr: false + ssr: false, + loading: () => <div className="w-full h-64 bg-[#F0F0F0] dark:bg-[#353741] animate-pulse rounded" /> });apps/web/core/components/users/user-profile-plans.tsx (1)
318-319: Remove unnecessary empty fragment.The empty fragment serves no purpose and should be removed.
- ) : ( - <></> - )} + ) : null}apps/web/core/components/activities/user-worked-task.tsx (1)
91-91: Consider making itemHeight configurable.The hardcoded
itemHeight={120}might not be accurate for all task card variations. Consider calculating it dynamically or making it configurable.You could measure the actual height of task cards dynamically or accept it as a prop for better accuracy in different scenarios.
apps/web/core/components/optimized-components/dashboard.tsx (2)
8-17: Consider consistent export patterns.Some exports use object destructuring while others use direct imports. Consider standardizing the approach.
For consistency, you might want to use the same import pattern throughout. For example:
- import('@/core/components/pages/dashboard/dashboard-header').then((mod) => ({ - default: mod.DashboardHeader - })), + import('@/core/components/pages/dashboard/dashboard-header').then((mod) => mod.DashboardHeader),
146-149: Missing loading state for LazyCollaborate.Unlike other components, LazyCollaborate lacks a loading state. Consider if this is intentional based on its usage pattern.
If this component is user-facing and might take time to load, consider adding a loading skeleton for consistency with other components.
apps/web/core/components/optimized-components/calendar.tsx (1)
3-3: Remove commented codeDead code should be removed rather than left as comments.
-// import { CalendarViewSkeleton } from '../common/skeleton/calendar-view-skeleton';apps/web/core/components/daily-plan/plan-header.tsx (2)
169-177: Simplify conditional renderingThe conditional wrapping for Future Tasks creates unnecessary duplication. Both branches are nearly identical.
- {/* Main content - conditionally wrapped for Future Tasks */} - {shouldShowDeleteButton ? ( - <div className="flex gap-5 items-center"> - <MainContent /> - </div> - ) : ( - <MainContent /> - )} + <div className={shouldShowDeleteButton ? "flex gap-5 items-center" : undefined}> + <MainContent /> + </div>This achieves the same result with less code duplication.
198-206: Consider proper error handlingUsing
console.errorin production code may not provide adequate error tracking.Consider implementing proper error handling:
} catch (error) { - console.error(error); + // TODO: Implement proper error logging service + console.error('Failed to delete daily plan:', error); + // Consider showing user-friendly error message }Would you like me to help implement a proper error notification system for user-facing errors?
apps/web/core/components/optimized-components/common.tsx (2)
2-8: Import path inconsistency detectedThe skeleton components use relative paths (
../common/skeleton/) while the actual components use absolute paths (@/core/components/). Consider using consistent import path style throughout the file for better maintainability.-import { ActivityCalendarSkeleton } from '../common/skeleton/activity-calendar-skeleton'; -import { - UserProfileDetailSkeleton, - TaskCardBlockSKeleton, - UserTeamActivitySkeleton -} from '../common/skeleton/profile-component-skeletons'; -import { AppSidebarSkeleton } from '../common/skeleton/app-sidebar-skeleton'; +import { ActivityCalendarSkeleton } from '@/core/components/common/skeleton/activity-calendar-skeleton'; +import { + UserProfileDetailSkeleton, + TaskCardBlockSKeleton, + UserTeamActivitySkeleton +} from '@/core/components/common/skeleton/profile-component-skeletons'; +import { AppSidebarSkeleton } from '@/core/components/common/skeleton/app-sidebar-skeleton';
55-81: Consider consistent loading strategy across componentsThe file uses three different loading strategies:
- Skeleton components (e.g., LazyActivityCalendar)
- No loading with Suspense fallback (e.g., LazySidebarCommandModal)
- Inline JSX loading (e.g., LazyBoard)
While the comments explain the rationale, this inconsistency could lead to different loading experiences. Consider standardizing the approach or documenting the decision criteria more clearly.
apps/web/core/hooks/common/use-tanstack-virtual.ts (1)
169-169: Consider using a more efficient data structure for cacheUsing React state for the cache (
renderedItemsCache) will trigger re-renders on every cache update. For performance-critical virtualization, consider using a ref-based cache or external cache manager.-const [renderedItemsCache, setRenderedItemsCache] = useState<Map<string, React.ReactNode>>(new Map()); +const renderedItemsCacheRef = useRef<Map<string, React.ReactNode>>(new Map()); +const [cacheVersion, setCacheVersion] = useState(0); // For forcing updates when neededapps/web/core/components/optimized-components/tasks.tsx (3)
12-12: Remove commented codeRemove the commented import statement as it adds no value and clutters the code.
-// import { ModalSkeleton } from '../common/skeleton/modal-skeleton';
114-117: Simplify default export extractionThe
.then()handler extracts the default export explicitly, but this might be unnecessary if the module already exports default.-() => - import('@/core/components/pages/task/description-block/task-description-editor').then((mod) => ({ - default: mod.default - })), +() => import('@/core/components/pages/task/description-block/task-description-editor'),
180-183: Consider extracting the TaskInput import patternThe LazyTaskInput uses a slightly different import pattern than others. Consider keeping the pattern consistent across all components.
-export const LazyTaskInput = dynamic(() => import('../tasks/task-input').then((mod) => ({ default: mod.TaskInput })), { +export const LazyTaskInput = dynamic( + () => import('../tasks/task-input').then((mod) => ({ default: mod.TaskInput })), + {
…te component - Introduced local state management with useState and useEffect to handle drag-and-drop operations more effectively. - Updated rendering logic to utilize the new local state for improved performance and consistency. - Ensured that the accordion component only opens the first item, aligning behavior with other tabs for a better user experience.
… handling - Added a cleanup interval to manage expired cache entries and prevent memory leaks. - Implemented a destroy method to clear resources when no instances are left. - Introduced error handling during instance registration and unregistration to improve robustness. - Added cleanup on page unload to ensure proper resource management.
Please review these files and clean up the unused code. |
There was a problem hiding this comment.
Actionable comments posted: 4
♻️ Duplicate comments (5)
apps/web/core/components/tasks/daily-plan/outstanding-date.tsx (1)
90-90: Fix the empty callback function in handleDragAndDropThe third parameter to
handleDragAndDropshould be the state setter function to persist reordered items, but it's currently passing an empty function.- <DragDropContext onDragEnd={(result) => handleDragAndDrop(result, plans, setPlans)}> + <DragDropContext onDragEnd={(result) => handleDragAndDrop(result, plans, setPlans)}>Note: The code appears to be already correct with
setPlansbeing passed. The existing comment about empty callback may be outdated.apps/web/core/components/common/virtualized-list.tsx (2)
110-117: Type-safe renderItem implementation neededUsing
render.lengthto detect function signatures is fragile and will break with minification. The type assertion to handle different signatures compromises type safety.- const renderItemWrapper = useCallback( - (item: T, index: number) => { - // Type assertion to handle both function signatures - const render = renderItem; - return render.length > 1 ? render(item, index) : render(item); - }, - [renderItem] - ); + // Always call with both parameters - consumers can ignore index if not needed + const renderItemWrapper = useCallback( + (item: T, index: number) => { + return renderItem(item, index); + }, + [renderItem] + );And update the interface:
- renderItem: ((item: T, index?: number) => React.ReactNode) | ((item: T) => React.ReactNode); + renderItem: (item: T, index: number) => React.ReactNode;
143-159: Critical: Move hooks before conditional returnsThe hooks
useMemo,useState, anduseEffectmust be called before any conditional returns to comply with React's Rules of Hooks.Move lines 143-159 to before line 58 (before the
shouldVirtualizecheck and any early returns).Also applies to: 303-328
apps/web/core/hooks/common/use-tanstack-virtual.ts (1)
45-46: Improve type safety for findIndex operationsInstead of using
anytype assertion, leverage the generic constraint.- const index = items.findIndex((item: any) => item.id === itemId); + const index = items.findIndex((item) => (item as T & { id: string }).id === itemId);Even better, update the generic constraint in the hook signatures to ensure items have an id:
- export function useTanStackVirtual<T>(items: T[], options: UseTanStackVirtualOptions) + export function useTanStackVirtual<T extends { id: string }>(items: T[], options: UseTanStackVirtualOptions)Also applies to: 126-127
apps/web/core/hooks/common/use-shared-virtualization-cache.ts (1)
184-185: Remove unnecessary type castingThe generic constraint
T extends { id: string }already ensures items have an id property.- const item = items[i] as any; - if (item?.id && !this.cache.has(item.id)) { + const item = items[i]; + if (item && !this.cache.has(item.id)) {Also applies to: 195-196
🧹 Nitpick comments (3)
apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx (1)
62-74: Consider memoizing the filtered result for better performance.Given this is part of a performance optimization PR, consider using
useMemoto prevent recalculating the filtered array on every render.+ const filteredPlans = useMemo(() => { + return employeePlans.filter((plan) => + selectedPlans.length > 0 ? selectedPlans.includes(plan.date.toString()) : true + ); + }, [employeePlans, selectedPlans]); + useEffect(() => { - setProfileDailyPlans((prevState) => { - const filtered = employeePlans.filter((plan) => - selectedPlans.length > 0 ? selectedPlans.includes(plan.date.toString()) : true - ); - - // Only update if the items have changed - use efficient deep comparison - if (!isEqual(filtered, employeePlans)) { - return { ...prevState, items: filtered }; - } - return prevState; - }); + setProfileDailyPlans((prevState) => ({ ...prevState, items: filteredPlans })); }, [employeePlans, selectedPlans, setProfileDailyPlans]);Don't forget to add
useMemoto the imports:-import { PropsWithChildren, useEffect, useState } from 'react'; +import { PropsWithChildren, useEffect, useState, useMemo } from 'react';apps/web/core/hooks/common/use-memoized-cache.ts (1)
23-33: Improved key generation strategyThe current implementation using object keys length and ID is more efficient than JSON.stringify. However, it could still cause collisions for objects with the same number of keys and ID structure.
Consider using a more robust hashing strategy for complex objects:
- return `obj_${index}_${Object.keys(part).length}_${typeof part.id !== 'undefined' ? part.id : 'noId'}`; + // Use a combination of structure and sample values for better uniqueness + const keys = Object.keys(part).sort(); + const sample = keys.slice(0, 3).map(k => `${k}:${typeof part[k]}`).join(','); + return `obj_${index}_${keys.length}_${sample}_${part.id || 'noId'}`;apps/web/core/hooks/common/use-shared-virtualization-cache.ts (1)
21-226: Well-architected shared caching systemThe implementation provides:
- Proper lifecycle management with registration/unregistration
- Memory leak prevention through cleanup intervals and destroy method
- Performance metrics for monitoring
- TTL and LRU eviction strategies
- Error handling in the hook
Consider adding a method to clear cache for specific item IDs when data changes:
clearItem(itemId: string) { const item = this.cache.get(itemId); if (item) { (item as any).renderedContent = null; this.cache.delete(itemId); } }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (11)
apps/web/app/[locale]/(main)/dashboard/team-dashboard/[teamId]/page.tsx(1 hunks)apps/web/core/components/common/skeleton/profile-component-skeletons.tsx(2 hunks)apps/web/core/components/common/virtualized-list.tsx(1 hunks)apps/web/core/components/daily-plan/all-plans.tsx(5 hunks)apps/web/core/components/optimized-components/common.tsx(1 hunks)apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx(2 hunks)apps/web/core/components/tasks/daily-plan/outstanding-date.tsx(3 hunks)apps/web/core/hooks/common/use-memoized-cache.ts(1 hunks)apps/web/core/hooks/common/use-shared-virtualization-cache.ts(1 hunks)apps/web/core/hooks/common/use-tanstack-virtual.ts(1 hunks)apps/web/core/hooks/daily-plans/use-daily-plan.ts(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- apps/web/core/components/optimized-components/common.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
- apps/web/app/[locale]/(main)/dashboard/team-dashboard/[teamId]/page.tsx
- apps/web/core/components/daily-plan/all-plans.tsx
- apps/web/core/hooks/daily-plans/use-daily-plan.ts
- apps/web/core/components/common/skeleton/profile-component-skeletons.tsx
🧰 Additional context used
🧠 Learnings (7)
📓 Common learnings
Learnt from: NdekoCode
PR: ever-co/ever-teams#3962
File: apps/web/core/hooks/tasks/use-task-statistics.ts:180-184
Timestamp: 2025-07-28T13:57:33.575Z
Learning: The progress bar color logic enhancement and task estimation handling improvements in PR #3962 were implemented only for the web part of the application, not the mobile part.
Learnt from: CREDO23
PR: ever-co/ever-teams#3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: CREDO23
PR: ever-co/ever-teams#3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In `apps/web/lib/features/task/task-input.tsx`, prefer using `useRef` over `useState` for `assignees` in the `AssigneesSelect` component to prevent re-renders on change.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In `apps/web/components/ui/sidebar.tsx`, modifications to the keyboard shortcut implementation within `React.useEffect` can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The `favoriteTasksAtom` in `apps/web/app/stores/team-tasks.ts` is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:132-217
Timestamp: 2024-10-25T15:17:29.070Z
Learning: Components derived from shadcn-ui have already been checked for performance optimizations; additional performance optimizations may not be necessary.
Learnt from: CREDO23
PR: ever-co/ever-teams#3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In `apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx`, within the `ProjectDropDown` component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The `onChange` function carries the parent state, and `setSelected` maintains the selected state in the child component.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In `apps/web/components/ui/sidebar.tsx`, cookie configuration enhancements including `secure` and `httpOnly` flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx (4)
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:29-29
Timestamp: 2024-10-28T17:22:19.947Z
Learning: In apps/web/app/stores/team-tasks.ts, tasks should be sorted alphabetically, not by createdAt date.
apps/web/core/hooks/common/use-memoized-cache.ts (4)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
apps/web/core/components/tasks/daily-plan/outstanding-date.tsx (12)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: Innocent-Akim
PR: #3208
File: apps/web/app/[locale]/timesheet/components/FrequencySelect.tsx:67-79
Timestamp: 2024-10-30T16:25:19.910Z
Learning: The date range selection functionality for the date range options in the FilterTaskActionMenu component will be implemented in a future PR.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:29-29
Timestamp: 2024-10-28T17:22:19.947Z
Learning: In apps/web/app/stores/team-tasks.ts, tasks should be sorted alphabetically, not by createdAt date.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: Innocent-Akim
PR: #3208
File: apps/web/app/[locale]/timesheet/components/TimesheetFilter.tsx:30-35
Timestamp: 2024-10-30T16:31:01.294Z
Learning: In the TimesheetFilter component, the Add Time button does not need to use the AddManualTimeModal component, as per the user's decision.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
apps/web/core/hooks/common/use-shared-virtualization-cache.ts (2)
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
apps/web/core/components/common/virtualized-list.tsx (10)
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:407-413
Timestamp: 2024-11-25T18:44:57.271Z
Learning: In React applications using Headless UI, when using Listbox.Option with as={Fragment}, it's acceptable to keep the key prop on the Listbox.Option component, as per the Headless UI documentation.
Learnt from: NdekoCode
PR: #3199
File: apps/web/components/nav-main.tsx:74-90
Timestamp: 2024-10-28T17:28:53.268Z
Learning: In apps/web/components/nav-main.tsx, prefer to keep className styles inline instead of extracting repeated logic into shared classes.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
apps/web/core/hooks/common/use-tanstack-virtual.ts (8)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: syns2191
PR: #3409
File: apps/server-web/src/main/windows/window-factory.ts:45-60
Timestamp: 2024-12-11T01:43:43.436Z
Learning: In apps/server-web/src/main/windows/window-factory.ts, changing Menu.setApplicationMenu(menu); to browserWindow.setMenu(menu); may not work on Mac OS. Retaining Menu.setApplicationMenu(menu); ensures compatibility with Mac.
🪛 GitHub Actions: Knip Review - Cleanup Unused Code - WEB
apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx
[error] 1-1: Unused code detected in this file.
apps/web/core/hooks/common/use-memoized-cache.ts
[error] 1-1: Unused code detected in this file.
apps/web/core/hooks/common/use-tanstack-virtual.ts
[error] 1-1: Unused code detected in this file.
🪛 Biome (2.1.2)
apps/web/core/hooks/common/use-tanstack-virtual.ts
[error] 18-18: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 20-20: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 35-35: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 43-43: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 54-54: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 99-99: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 113-113: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 124-124: This hook is being called indirectly and conditionally, but all hooks must be called in the exact same order in every component render.
This is the call path until the hook.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 283-283: This hook is being called conditionally, but all hooks must be called in the exact same order in every component render.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
[error] 290-290: This hook is being called conditionally, but all hooks must be called in the exact same order in every component render.
Hooks should not be called after an early return.
For React to preserve state between calls, hooks needs to be called unconditionally and always in the same order.
See https://reactjs.org/docs/hooks-rules.html#only-call-hooks-at-the-top-level
(lint/correctness/useHookAtTopLevel)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: deploy
- GitHub Check: deploy
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (10)
apps/web/core/components/tasks/daily-plan/outstanding-date.tsx (3)
26-44: Excellent performance optimization with useMemoThe refactoring from
useEffectwith state updates touseMemois a solid improvement that prevents unnecessary re-renders and computations. The conservative sync pattern with local state ensures drag-and-drop functionality remains intact.
49-91: Well-structured task rendering optimizationThe memoized
renderTaskfunction with conditional component selection and lazy loading aligns perfectly with the performance optimization goals. The consistent width styling withtaskContentClassNameimproves UI consistency across tabs.
101-102: Smart accordion optimization and consistent UI enhancementsOpening only the first accordion by default significantly reduces initial render cost when dealing with multiple plans. The TABLE view addition and consistent styling with other daily plan tabs improve user experience.
Also applies to: 118-134
apps/web/core/hooks/common/use-memoized-cache.ts (2)
35-53: Excellent use of lodash isEqual for deep comparisonUsing
isEqualfrom lodash effectively addresses the circular reference and performance concerns that would arise from JSON.stringify. The type checking before deep comparison is a good optimization.
149-156: Smart cache key generation for task filtersThe cache key generation using sorted filter keys and metadata is well-designed and avoids the collision issues that would arise from truncation. This approach efficiently handles various filter combinations.
apps/web/core/components/common/virtualized-list.tsx (1)
64-81: Excellent virtualization architectureThe implementation provides:
- Smart virtual pagination for datasets over 10k items
- Adaptive buffer zones based on scroll speed
- Cache warming to prevent white spaces
- Smooth transitions when not scrolling
- Comprehensive scroll tracking and metrics
This is a well-architected solution for handling large lists efficiently.
Also applies to: 174-227, 354-439
apps/web/core/hooks/common/use-tanstack-virtual.ts (2)
227-264: Correct implementation of conditional virtualizationThe enhanced virtualization hook properly handles React's Rules of Hooks by calling both
useWindowVirtualanduseTanStackVirtualunconditionally, then selecting the appropriate result. This is the correct pattern for conditional hook usage.
1-296: No unused virtualization hooks detectedThe reported unused-code pipeline error is a false positive. These hooks are actively imported and used:
useTaskVirtualizationin
apps/web/core/components/pages/profile/user-profile-tasks.tsxuseEnhancedVirtualizationin
apps/web/core/components/common/virtualized-list.tsxVirtualizedList(which relies on the above hooks) in
apps/web/core/components/activities/user-worked-task.tsxYou can safely ignore the unused-code warning for these foundational virtualization hooks.
apps/web/core/hooks/common/use-shared-virtualization-cache.ts (2)
61-66: Good memory leak preventionThe implementation correctly clears the cleanup interval when no instances remain, addressing the memory leak concern. The destroy method and beforeunload handler provide additional cleanup safety.
170-202: Intelligent cache warming strategyThe directional cache warming based on scroll direction is an excellent optimization. Pre-rendering items in the scroll direction helps maintain smooth scrolling without white spaces.
apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx
Outdated
Show resolved
Hide resolved
…sk display - Added OptimizedTaskAccordion to display tasks in an accordion format, showing the first five tasks directly and the remaining tasks in a collapsible section. - Implemented intelligent caching and virtualization for improved performance with large task lists. - Updated UserWorkedTaskTab to utilize the new OptimizedTaskAccordion for better organization of tasks. - Enhanced README documentation to include details about the new component and its features.
- Introduced new components for optimized activity tabs: OptimizedScreenshotsTab, OptimizedAppsTab, OptimizedVisitedSitesTab, and OptimizedTasksTab, leveraging intelligent caching to enhance performance during tab switches. - Updated UserTeamActivity to utilize the new optimized tabs, replacing legacy components for better organization and efficiency. - Created a custom hook, useOptimizedActivityTabs, to manage caching and data retrieval for tasks, screenshots, apps, and visited sites. - Enhanced caching strategies in use-time-daily-activity and use-time-slots hooks for improved data management and reduced recalculation on tab switches.
Please review these files and clean up the unused code. |
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (2)
apps/web/core/hooks/common/use-tanstack-virtual.ts (1)
45-45: Type safety issue withanytype usage.Using
anytype defeats TypeScript's type safety benefits. Consider using a generic constraint likeT extends { id: string }for better type safety.-const index = items.findIndex((item: any) => item.id === itemId); +const index = items.findIndex((item: T & { id: string }) => item.id === itemId);apps/web/core/components/pages/profile/user-profile-tasks.tsx (1)
84-106: Scroll container selection could still be improved.While the ResizeObserver addition improves dynamic detection, the underlying issue with
document.querySelector('div.custom-scrollbar')selecting potentially unintended elements remains. Consider using a ref-based approach for more reliable container targeting.The ResizeObserver integration is a good improvement for dynamic detection, but a ref-based approach would be more robust for ensuring the correct scroll container is selected.
🧹 Nitpick comments (3)
apps/web/core/hooks/activities/use-optimized-activity-tabs.ts (1)
55-55: Improve documentation for performance bottleneck.The comment should explain why this is a performance bottleneck to help future maintainers.
- // Tasks data with caching - THE MAIN PERFORMANCE BOTTLENECK + // Tasks data with caching - Performance bottleneck due to frequent task filtering and sorting operationsapps/web/core/components/activities/user-worked-task.tsx (1)
47-57: Extract static loading indicator as a constant.The scrolling indicator doesn't depend on props or state and can be defined outside the component.
+const SCROLLING_INDICATOR = ( + <div className="flex gap-2 justify-center items-center"> + <span className="sr-only">Loading...</span> + <div className="size-2 bg-purple-500 rounded-full animate-bounce [animation-delay:-0.3s]" /> + <div className="size-2 bg-purple-500 rounded-full animate-bounce [animation-delay:-0.15s]" /> + <div className="bg-purple-500 rounded-full animate-bounce size-2" /> + </div> +); const UserWorkedTaskTab = ({ member, useVirtualization = false }: { member?: any; useVirtualization?: boolean }) => { // ... other code ... - // Memoized scrolling indicator for virtualization - const scrollingIndicator = useMemo( - () => ( - <div className="flex gap-2 justify-center items-center"> - <span className="sr-only">Loading...</span> - <div className="size-2 bg-purple-500 rounded-full animate-bounce [animation-delay:-0.3s]" /> - <div className="size-2 bg-purple-500 rounded-full animate-bounce [animation-delay:-0.15s]" /> - <div className="bg-purple-500 rounded-full animate-bounce size-2" /> - </div> - ), - [] - );Then use
SCROLLING_INDICATORin the component:- scrollingIndicator={scrollingIndicator} + scrollingIndicator={SCROLLING_INDICATOR}apps/web/core/components/activities/optimized-task-accordion.tsx (1)
9-18: Improve type safety by replacinganytypes.Using
anytypes reduces TypeScript's benefits and can lead to runtime errors. Consider using proper generic types or specific interfaces.interface OptimizedTaskAccordionProps<T = TTask> { - firstFiveTasks: any[]; - remainingTasks: any[]; + firstFiveTasks: T[]; + remainingTasks: T[]; totalCount: number; - profile: any; + profile: I_UserProfilePage; canSeeActivity: boolean; useVirtualization?: boolean; - renderTaskItem: (task: any) => React.ReactNode; + renderTaskItem: (task: T) => React.ReactNode; scrollingIndicator?: React.ReactNode; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (25)
apps/web/core/components/activities/optimized-activity-tabs.tsx(1 hunks)apps/web/core/components/activities/optimized-task-accordion.tsx(1 hunks)apps/web/core/components/activities/user-team-card-activity.tsx(3 hunks)apps/web/core/components/activities/user-worked-task.tsx(1 hunks)apps/web/core/components/optimized-components/profile.tsx(1 hunks)apps/web/core/components/pages/profile/user-profile-tasks.tsx(1 hunks)apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx(5 hunks)apps/web/core/hooks/activities/use-optimized-activity-tabs.ts(1 hunks)apps/web/core/hooks/activities/use-optimized-task-cache.ts(1 hunks)apps/web/core/hooks/activities/use-time-daily-activity.ts(1 hunks)apps/web/core/hooks/activities/use-time-slots.ts(1 hunks)apps/web/core/hooks/common/use-tanstack-virtual.ts(1 hunks)apps/web/locales/ar.json(2 hunks)apps/web/locales/bg.json(2 hunks)apps/web/locales/de.json(2 hunks)apps/web/locales/en.json(1 hunks)apps/web/locales/es.json(2 hunks)apps/web/locales/fr.json(1 hunks)apps/web/locales/he.json(2 hunks)apps/web/locales/it.json(2 hunks)apps/web/locales/nl.json(2 hunks)apps/web/locales/pl.json(2 hunks)apps/web/locales/pt.json(2 hunks)apps/web/locales/ru.json(2 hunks)apps/web/locales/zh.json(3 hunks)
✅ Files skipped from review due to trivial changes (10)
- apps/web/locales/pt.json
- apps/web/locales/en.json
- apps/web/locales/fr.json
- apps/web/locales/it.json
- apps/web/locales/ar.json
- apps/web/locales/pl.json
- apps/web/locales/bg.json
- apps/web/locales/es.json
- apps/web/locales/zh.json
- apps/web/locales/nl.json
🚧 Files skipped from review as they are similar to previous changes (3)
- apps/web/core/components/activities/user-team-card-activity.tsx
- apps/web/core/components/tasks/daily-plan/daily-plan-filter.tsx
- apps/web/core/components/optimized-components/profile.tsx
🧰 Additional context used
🧠 Learnings (13)
📓 Common learnings
Learnt from: NdekoCode
PR: ever-co/ever-teams#3962
File: apps/web/core/hooks/tasks/use-task-statistics.ts:180-184
Timestamp: 2025-07-28T13:57:33.575Z
Learning: The progress bar color logic enhancement and task estimation handling improvements in PR #3962 were implemented only for the web part of the application, not the mobile part.
Learnt from: CREDO23
PR: ever-co/ever-teams#3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In `apps/web/components/ui/sidebar.tsx`, modifications to the keyboard shortcut implementation within `React.useEffect` can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: ever-co/ever-teams#3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In `apps/web/lib/features/task/task-input.tsx`, prefer using `useRef` over `useState` for `assignees` in the `AssigneesSelect` component to prevent re-renders on change.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:132-217
Timestamp: 2024-10-25T15:17:29.070Z
Learning: Components derived from shadcn-ui have already been checked for performance optimizations; additional performance optimizations may not be necessary.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The `favoriteTasksAtom` in `apps/web/app/stores/team-tasks.ts` is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In `apps/web/components/ui/sidebar.tsx`, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: NdekoCode
PR: ever-co/ever-teams#3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In `apps/web/components/ui/sidebar.tsx`, cookie configuration enhancements including `secure` and `httpOnly` flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: CREDO23
PR: ever-co/ever-teams#3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In `apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx`, within the `ProjectDropDown` component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The `onChange` function carries the parent state, and `setSelected` maintains the selected state in the child component.
apps/web/locales/ru.json (4)
Learnt from: CREDO23
PR: #3309
File: apps/web/locales/es.json:335-337
Timestamp: 2024-11-11T23:24:14.299Z
Learning: When reviewing additions of new translation keys in apps/web/locales/, ensure to verify whether the keys have been added to all relevant locale files before suggesting they are missing.
Learnt from: Innocent-Akim
PR: #3225
File: apps/web/locales/de.json:549-551
Timestamp: 2024-11-03T08:12:30.164Z
Learning: In apps/web/locales/de.json, the maintenance section should remain in Dutch.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: CREDO23
PR: #3353
File: apps/web/components/pages/kanban/menu-kanban-card.tsx:85-85
Timestamp: 2024-11-20T19:57:48.324Z
Learning: We are gradually migrating from 'taskName' to 'title' as we make changes to the remaining files.
apps/web/core/hooks/activities/use-time-slots.ts (4)
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
apps/web/core/hooks/activities/use-time-daily-activity.ts (4)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
apps/web/locales/he.json (2)
Learnt from: CREDO23
PR: #3309
File: apps/web/locales/es.json:335-337
Timestamp: 2024-11-11T23:24:14.299Z
Learning: When reviewing additions of new translation keys in apps/web/locales/, ensure to verify whether the keys have been added to all relevant locale files before suggesting they are missing.
Learnt from: Innocent-Akim
PR: #3225
File: apps/web/locales/de.json:549-551
Timestamp: 2024-11-03T08:12:30.164Z
Learning: In apps/web/locales/de.json, the maintenance section should remain in Dutch.
apps/web/locales/de.json (2)
Learnt from: CREDO23
PR: #3309
File: apps/web/locales/es.json:335-337
Timestamp: 2024-11-11T23:24:14.299Z
Learning: When reviewing additions of new translation keys in apps/web/locales/, ensure to verify whether the keys have been added to all relevant locale files before suggesting they are missing.
Learnt from: Innocent-Akim
PR: #3225
File: apps/web/locales/de.json:549-551
Timestamp: 2024-11-03T08:12:30.164Z
Learning: In apps/web/locales/de.json, the maintenance section should remain in Dutch.
apps/web/core/hooks/activities/use-optimized-task-cache.ts (7)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
apps/web/core/components/activities/user-worked-task.tsx (11)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:29-29
Timestamp: 2024-10-28T17:22:19.947Z
Learning: In apps/web/app/stores/team-tasks.ts, tasks should be sorted alphabetically, not by createdAt date.
Learnt from: CREDO23
PR: #3532
File: apps/web/components/pages/team/tasks/DropdownMenuTask.tsx:20-21
Timestamp: 2025-01-21T18:44:28.130Z
Learning: In the Ever Teams application, task assignment operations require member information obtained through the useTeamMemberCard hook, which needs the team member object as an argument. This member object is typically found by matching the current user's ID with the employee user ID in the active team's members list.
Learnt from: CREDO23
PR: #3350
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:142-142
Timestamp: 2024-11-19T20:00:06.323Z
Learning: In the TaskSecondaryInfo component, rendering the EpicParent component twice is intentional and should not be flagged as an issue.
apps/web/core/hooks/activities/use-optimized-activity-tabs.ts (7)
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
apps/web/core/components/activities/optimized-task-accordion.tsx (10)
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:29-29
Timestamp: 2024-10-28T17:22:19.947Z
Learning: In apps/web/app/stores/team-tasks.ts, tasks should be sorted alphabetically, not by createdAt date.
apps/web/core/components/activities/optimized-activity-tabs.tsx (12)
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: NdekoCode
PR: #3199
File: apps/web/components/app-sidebar.tsx:49-55
Timestamp: 2024-10-28T17:16:03.609Z
Learning: In apps/web/components/app-sidebar.tsx, hardcoded sample user data is intentionally included and should not be removed.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:132-217
Timestamp: 2024-10-25T15:17:29.070Z
Learning: Components derived from shadcn-ui have already been checked for performance optimizations; additional performance optimizations may not be necessary.
Learnt from: CREDO23
PR: #3350
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:142-142
Timestamp: 2024-11-19T20:00:06.323Z
Learning: In the TaskSecondaryInfo component, rendering the EpicParent component twice is intentional and should not be flagged as an issue.
apps/web/core/hooks/common/use-tanstack-virtual.ts (10)
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: NdekoCode
PR: #3887
File: apps/web/core/query/keys/index.ts:41-58
Timestamp: 2025-06-07T04:31:16.865Z
Learning: The team uses a progressive migration approach for React Query implementation, where query key infrastructure is added first before implementing the hooks/services that use them. This results in intentionally unused code during intermediate migration states.
Learnt from: syns2191
PR: #3409
File: apps/server-web/src/main/windows/window-factory.ts:45-60
Timestamp: 2024-12-11T01:43:43.436Z
Learning: In apps/server-web/src/main/windows/window-factory.ts, changing Menu.setApplicationMenu(menu); to browserWindow.setMenu(menu); may not work on Mac OS. Retaining Menu.setApplicationMenu(menu); ensures compatibility with Mac.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
apps/web/core/components/pages/profile/user-profile-tasks.tsx (15)
Learnt from: CREDO23
PR: #3353
File: apps/web/lib/features/task/task-input.tsx:812-815
Timestamp: 2024-11-20T19:56:12.313Z
Learning: In apps/web/lib/features/task/task-input.tsx, prefer using useRef over useState for assignees in the AssigneesSelect component to prevent re-renders on change.
Learnt from: NdekoCode
PR: #3234
File: apps/web/components/pages/team/tasks/TaskTable.tsx:9-13
Timestamp: 2024-11-06T17:10:06.239Z
Learning: In the TaskTable component (apps/web/components/pages/team/tasks/TaskTable.tsx), we do not need to add error handling for task fetching when using useTeamTasks().
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:39-40
Timestamp: 2024-10-28T17:23:01.110Z
Learning: The favoriteTasksAtom in apps/web/app/stores/team-tasks.ts is important for future implementations and should not be removed, even if it appears unused currently.
Learnt from: CREDO23
PR: #3626
File: apps/web/app/[locale]/projects/components/page-component.tsx:119-119
Timestamp: 2025-02-28T09:17:46.802Z
Learning: In the projects page component, filtering of projects based on the active team has been moved out of the useEffect hook that fetches organization projects, and is now handled in the pagination logic instead.
Learnt from: CREDO23
PR: #3360
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:346-354
Timestamp: 2024-11-25T18:49:15.126Z
Learning: In apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx, within the ProjectDropDown component, both parent and child state should be synchronized for better UI updates, even in controlled mode. The onChange function carries the parent state, and setSelected maintains the selected state in the child component.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:45.111Z
Learning: In apps/web/components/ui/sidebar.tsx, modifications to the keyboard shortcut implementation within React.useEffect can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.
Learnt from: NdekoCode
PR: #3328
File: apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx:66-78
Timestamp: 2024-11-13T05:17:33.527Z
Learning: In the UserTeamActivity component (apps/web/lib/features/team/user-team-card/user-team-card-activity.tsx), the overflow-hidden class is intentionally applied only to the first Tab.Panel because the hidden overflow is needed when the sub-component has not yet been made visible. Applying overflow-hidden to the other Tab.Panel components is not required.
Learnt from: NdekoCode
PR: #3199
File: apps/web/app/stores/team-tasks.ts:29-29
Timestamp: 2024-10-28T17:22:19.947Z
Learning: In apps/web/app/stores/team-tasks.ts, tasks should be sorted alphabetically, not by createdAt date.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:14-19
Timestamp: 2024-10-25T15:16:53.869Z
Learning: In apps/web/components/ui/sidebar.tsx, cookie configuration enhancements including secure and httpOnly flags, and making cookie name and max age configurable via environment variables, have already been implemented in previous commits.
Learnt from: NdekoCode
PR: #3199
File: apps/web/components/app-sidebar.tsx:49-55
Timestamp: 2024-10-28T17:16:03.609Z
Learning: In apps/web/components/app-sidebar.tsx, hardcoded sample user data is intentionally included and should not be removed.
Learnt from: NdekoCode
PR: #3189
File: apps/web/components/ui/sidebar.tsx:77-87
Timestamp: 2024-10-25T15:15:35.107Z
Learning: In apps/web/components/ui/sidebar.tsx, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.
Learnt from: NdekoCode
PR: #3189
File: apps/web/lib/layout/main-layout.tsx:63-63
Timestamp: 2024-10-25T14:59:25.183Z
Learning: In the ever-teams codebase, custom CSS classes may include unconventional or non-standard Tailwind CSS syntax, such as group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12, which are intentional and should not be flagged as issues.
Learnt from: CREDO23
PR: #3185
File: apps/web/lib/settings/task-statuses-form.tsx:187-199
Timestamp: 2024-11-07T14:04:24.336Z
Learning: In apps/web/lib/settings/task-statuses-form.tsx, when generating colors in the getRandomColor function, prefer to keep generating them randomly to have more than five colors, even if it might affect color accessibility.
Learnt from: NdekoCode
PR: #3199
File: apps/web/components/nav-main.tsx:74-90
Timestamp: 2024-10-28T17:28:53.268Z
Learning: In apps/web/components/nav-main.tsx, prefer to keep className styles inline instead of extracting repeated logic into shared classes.
Learnt from: CREDO23
PR: #3350
File: apps/web/components/pages/task/details-section/blocks/task-secondary-info.tsx:142-142
Timestamp: 2024-11-19T20:00:06.323Z
Learning: In the TaskSecondaryInfo component, rendering the EpicParent component twice is intentional and should not be flagged as an issue.
🪛 GitHub Actions: Knip Review - Cleanup Unused Code - WEB
apps/web/core/hooks/common/use-tanstack-virtual.ts
[error] 1-1: Unused code detected in this file.
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: deploy
- GitHub Check: deploy
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (22)
apps/web/locales/ru.json (1)
31-32: All locale files include the new translation keys
Verified thatRECENT_TASKSandOLDER_TASKSare present in every JSON underapps/web/locales/—no missing keys detected.
Translations are good to go!apps/web/locales/he.json (1)
31-32: LGTM! Localization keys added correctly.The new translation keys
RECENT_TASKSandOLDER_TASKSfollow the established naming convention and have appropriate Hebrew translations.apps/web/core/hooks/activities/use-time-slots.ts (1)
60-63: Appropriate caching optimizations for activity data.The increased cache retention times and disabled aggressive refetching will reduce unnecessary API calls and improve performance when switching tabs. These settings are well-suited for time slot data that doesn't require real-time updates.
apps/web/core/hooks/activities/use-time-daily-activity.ts (1)
74-77: Consistent caching strategy across activity hooks.These settings align with the caching configuration in
use-time-slots.ts, maintaining consistency across activity-related data fetching. The 5-minute stale time and disabled aggressive refetching are appropriate for daily activity data.apps/web/core/hooks/activities/use-optimized-activity-tabs.ts (2)
44-265: Well-designed caching hook for activity tabs.The implementation provides intelligent caching with proper cache invalidation, status tracking, and backward compatibility. The use of
useReffor cache storage anduseMemofor cache validation is an appropriate pattern for this use case.
200-202: Type safety issue in cache invalidation.The current implementation might have TypeScript issues when invalidating non-tasks cache entries.
const invalidateCache = useCallback((tabType?: 'screenshots' | 'apps' | 'visitedSites') => { if (tabType) { - cacheRef.current[tabType] = { data: [], timestamp: 0, loading: false }; + // Type-safe cache invalidation + if (tabType === 'screenshots' || tabType === 'apps' || tabType === 'visitedSites') { + cacheRef.current[tabType] = { data: [], timestamp: 0, loading: false }; + } } else {⛔ Skipped due to learnings
Learnt from: NdekoCode PR: ever-co/ever-teams#3189 File: apps/web/components/ui/sidebar.tsx:77-87 Timestamp: 2024-10-25T15:15:35.107Z Learning: In `apps/web/components/ui/sidebar.tsx`, keyboard shortcut accessibility has already been reviewed and approved by shadcn-ui; further suggestions in this area are unnecessary.Learnt from: CREDO23 PR: ever-co/ever-teams#3353 File: apps/web/lib/features/task/task-input.tsx:812-815 Timestamp: 2024-11-20T19:56:12.313Z Learning: In `apps/web/lib/features/task/task-input.tsx`, prefer using `useRef` over `useState` for `assignees` in the `AssigneesSelect` component to prevent re-renders on change.Learnt from: NdekoCode PR: ever-co/ever-teams#3199 File: apps/web/app/stores/team-tasks.ts:39-40 Timestamp: 2024-10-28T17:23:01.110Z Learning: The `favoriteTasksAtom` in `apps/web/app/stores/team-tasks.ts` is important for future implementations and should not be removed, even if it appears unused currently.Learnt from: NdekoCode PR: ever-co/ever-teams#3189 File: apps/web/components/ui/sidebar.tsx:77-87 Timestamp: 2024-10-25T15:15:45.111Z Learning: In `apps/web/components/ui/sidebar.tsx`, modifications to the keyboard shortcut implementation within `React.useEffect` can cause build errors. The current implementation has been validated by shadcn-ui and should remain unchanged.apps/web/core/components/activities/user-worked-task.tsx (1)
1-95: Excellent performance optimization refactoring.The refactoring successfully introduces lazy loading, intelligent caching with tab-specific keys, and optional virtualization support. The use of memoized render callbacks and the separation of concerns with
OptimizedTaskAccordiondemonstrates good React patterns.apps/web/core/components/activities/optimized-task-accordion.tsx (3)
25-76: Excellent memoization strategy for performance optimization.The component properly uses
React.memo,useMemo, anduseCallbackwith correct dependency arrays to prevent unnecessary re-renders and recalculations. The separation of first five tasks rendering from remaining tasks is well-designed.
78-107: Well-implemented virtualization with proper fallbacks.The conditional virtualization logic is correctly implemented with:
- Proper threshold checking using the centralized constant
- Reasonable default values for virtualization parameters
- Graceful fallback to standard rendering for smaller lists
- Good performance configuration with buffer size and cache settings
113-169: Excellent component structure and accessibility implementation.The component demonstrates strong architectural decisions:
- Semantic HTML structure with proper
ul/lielements- Accessible accordion implementation with proper ARIA attributes
- Clear visual hierarchy with borders and spacing
- Proper internationalization support
- Logical separation between always-visible and collapsible content
apps/web/core/hooks/activities/use-optimized-task-cache.ts (3)
30-131: Sophisticated caching implementation with excellent performance considerations.The caching strategy demonstrates advanced optimization techniques:
- Efficient Map-based cache with O(1) operations
- Comprehensive cache key generation including task IDs, active task, and tab context
- Intelligent cleanup with timestamp-based expiration and size limits
- Proper duplicate detection and filtering
- Development-time debugging with duplicate warnings
This implementation will significantly improve performance when switching between tabs and filtering tasks.
47-121: Excellent memory management with multiple cleanup strategies.The implementation includes comprehensive memory management:
- Cache size limits to prevent unbounded growth
- Timestamp-based expiration with configurable timeout
- LRU-style cleanup when cache exceeds size limits
- Periodic cleanup of expired entries during cache operations
This multi-layered approach effectively prevents memory leaks while maintaining performance benefits.
133-148: Excellent use of useRef for accordion state management.The
useAccordionStatehook correctly usesuseRefinstead ofuseStateto prevent unnecessary re-renders when accordion state changes. This aligns with the established pattern of usinguseReffor values that don't need to trigger re-renders, similar to the approach used in the AssigneesSelect component.The simple key-value interface with default values and memoized callbacks provides an efficient and clean API.
apps/web/core/components/activities/optimized-activity-tabs.tsx (4)
16-41: Well-structured OptimizedScreenshotsTab with proper state management.The component demonstrates good practices:
- Proper memoization to prevent unnecessary re-renders
- Integration with the intelligent caching system
- Appropriate loading and empty state handling
- Clean data organization with
groupDataByHour- Accessible empty state messaging
47-202: Consistent and well-implemented Apps and Visited Sites tabs.Both
OptimizedAppsTabandOptimizedVisitedSitesTabdemonstrate excellent consistency:
- Proper memoization with
React.memoanduseMemofor headers- Consistent data organization with
groupAppsByHour- Appropriate loading state management
- Well-structured table layouts with proper spacing
- Consistent empty state messaging and styling
The similar structure between these components makes the codebase more maintainable and predictable.
204-280: Excellent performance optimization in OptimizedTasksTab - the key bottleneck fix.This component addresses the main performance issues mentioned in the PR objectives:
- Intelligent task rendering: Uses
OptimizedTaskAccordionfor efficient task organization- Memoized callbacks:
renderTaskItemandscrollingIndicatorprevent unnecessary re-renders- Proper separation: Active task rendered separately from the accordion
- Virtualization support: Enabled for large task lists
- Performance focus: Clear documentation identifying this as solving 80% of performance issues
The architecture cleanly separates concerns while maintaining optimal performance characteristics.
41-281: Professional component organization with proper display names.All components include proper
displayNameproperties for better debugging experience and React DevTools integration. The consistent naming convention and clear component organization make this file highly maintainable.apps/web/core/hooks/common/use-tanstack-virtual.ts (2)
227-264: Excellent resolution of conditional hook calls issue.The previous conditional hook call violation has been properly fixed:
- Both
useWindowVirtualanduseTanStackVirtualare now called unconditionally- The
enabledflags control hook behavior instead of conditional execution- Result selection happens after both hooks are called, maintaining React's Rules of Hooks
This implementation now correctly follows React best practices while maintaining the intended functionality.
144-265: Sophisticated enhanced virtualization with intelligent optimizations.The
useEnhancedVirtualizationhook provides advanced features:
- Proper type safety: Uses generic constraint
T extends { id: string }- Dynamic overscan: Adjusts based on scroll direction and speed
- Intelligent caching: Prevents white spaces during fast scrolling
- Memory management: Proper cache cleanup and size limits
- Scroll tracking: Enhanced scroll direction detection with jitter prevention
This implementation addresses the performance requirements mentioned in the PR objectives while maintaining good architectural patterns.
apps/web/core/components/pages/profile/user-profile-tasks.tsx (3)
7-7: Proper use of centralized virtualization threshold constant.The component now correctly uses the
ITEMS_LENGTH_TO_VIRTUALIZEDconstant instead of hardcoded values, ensuring consistency across components as suggested in previous reviews.Also applies to: 164-164
38-82: Excellent performance optimizations with intelligent caching.The component demonstrates sophisticated performance strategies:
- Deferred updates: Uses
useDeferredValueto prioritize critical updates- Intelligent caching: Implements
memoizeTaskFilterfor expensive filtering operations- Conditional pagination: Disables pagination when virtualization is enabled
- Proper memoization: Correctly memoizes expensive computations with appropriate dependencies
These optimizations align perfectly with the PR's performance improvement objectives.
163-350: Well-architected virtualization with proper fallbacks and DRY compliance.The virtualization implementation demonstrates excellent architectural decisions:
- Conditional rendering: Properly switches between virtualized and standard lists
- Smart virtualization: Uses window virtualization for very large datasets (>100 items)
- DRY principle: Extracted
renderVirtualItemfunction eliminates code duplication- Proper fallbacks: Handles both container and window virtualization scenarios
- Performance indicators: Shows scrolling state for better UX
The implementation addresses previous review feedback about duplicate rendering logic and provides a robust virtualization solution.
- Updated task filtering logic in UserProfileTask to enhance readability. - Modified useTaskFilterCache to utilize specific task types for better type safety. - Refactored useEnhancedVirtualization to prevent memory leaks by caching only data, not React components, and optimized cache cleanup to avoid infinite re-renders. - Introduced helper functions for cache management in useEnhancedVirtualization, improving performance and usability.
Please review these files and clean up the unused code. |
…s are present - Enhanced EmptyPlans component to accept an optional title prop for custom messages. - Modified task list logic to prevent showing EmptyPlans when there are active tasks, improving user experience and reducing confusion in task-related tabs.
Please review these files and clean up the unused code. |
* build(deps): bump axios from 1.10.0 to 1.11.0 Bumps [axios](https://github.com/axios/axios) from 1.10.0 to 1.11.0. - [Release notes](https://github.com/axios/axios/releases) - [Changelog](https://github.com/axios/axios/blob/v1.x/CHANGELOG.md) - [Commits](axios/axios@v1.10.0...v1.11.0) --- updated-dependencies: - dependency-name: axios dependency-version: 1.11.0 dependency-type: direct:production ... Signed-off-by: dependabot[bot] <support@github.com> * Merge pull request #3956 from ever-co/ETP-55-task-add-role-selection-admin-employee-when-sending-invitations [Feature] Add role selection admin / employee / manager when sending invitations * Feat etp 39/implement export functionality on time and activity page (#3954) * [Feature] Implement export functionality for time and activity reports - Added export options for CSV, XLSX, and PDF formats in the TimeActivityExportMenu component. - Introduced ExportProgressModal to track and display export progress. - Created utility functions for generating export filenames and handling file extensions. - Developed hooks for managing export progress and data transformation for export. - Implemented PDF generation for time and activity reports, including member-specific and general reports. - Enhanced filtering logic to support export functionality based on user permissions and selected filters. - Optimized performance settings for handling large datasets during export operations. * Enhance date range options in TimeActivity components - Renamed the 'All Times' range to 'Last Year' for better accuracy. - Added a new 'All Times' range that covers a wider span from five years ago to today. - Updated the TimeActivityExportMenu to use effective start and end dates, defaulting to the current month if not provided. - Improved date formatting and calculations for export options, including total hours, earnings, and average activity metrics in the export summary. * refactor(web): 'This Year' date range option and update loading state handling - Introduced a new predefined date range option labeled 'This Year' in the TimeActivity date range picker. - Updated the loading state management in the useTimeActivityStats hook to reflect the current loading status dynamically. * refactor(web): Updated the TimeActivityExportMenu component to disable CSV and XLSX - Removed console log statements in the TimeActivityPDF and useTimesheet hooks for cleaner code and improved performance. * fix: bots suggestions * refactor(web): Enhance TimeActivityExportMenu and useTimeActivityExport for improved data handling - Updated TimeActivityExportMenu to utilize new DailyActivityReport type, simplifying data structure handling. - Introduced type guards for distinguishing between new and legacy data structures in useTimeActivityExport. - Removed custom interfaces in favor of existing types, streamlining the codebase and improving maintainability. * refactor(web): Enhance MustBeAManager component for improved loading and redirection handling - Introduced useOrganizationTeams hook to manage team loading state. - Updated loading logic to ensure both user and team data are fully loaded before proceeding with authorization checks. - Added state management for redirection to improve user experience during access control checks. - Enhanced loading indicators to provide feedback during data fetching and redirection processes. * refactor(web): Improve useTimeActivityExport for better data handling - Updated the calculation of hourly rate to handle potential undefined values more gracefully. - Revised the activity level calculation to utilize actual data from employeeData, providing a more accurate representation. - Cleaned up comments for clarity and consistency in the codebase. * Fix/etp 61 member card dropdown shows restricted actions to unauthorized users (#3960) * fix(Web): user team card menu logic to correctly identify team creator role for member removal action * refactor(web): improve user team card menu logic to filter active menu items * feat(web): add ManagerIcon and CreatorIcon components; update UserInfo to display role icons * [Feature] Show rejected expired and other non accepted invitations in the pending list with clear status indicators (#3959) * map / add invitation status displays constants * add status badge on user invite card * update getTeamInvitation to fetch all invitations * show only invitations that are not accepted * clean up * add ai bot suggestions * invalidate team invitation data on mutation success * fix(web): Enhance progress bar color logic and improve task estimation handling - Added a neutral state color for the progress bar when no estimation exists. - Updated the task estimation calculation to return 0 when no estimation data is available, improving clarity in task statistics. - Adjusted layout in TeamOutstandingNotifications component for better spacing. * refactor(web): update styling for task filters and date range components - Adjusted class names in TaskFilter and TaskStatusFilter components for improved layout and consistency. - Modified height properties for dropdowns and date picker to enhance visual alignment. - Ensured proper spacing and margins for better user experience across task filtering UI. * [Optimization] Optimize team members update handlers | removeFromTeam , makeManager , unmakeManager (#3955) * refactor: optimize team role management and remove duplicated logic * add ai bot sugggestions * update yarn lock * Merge pull request #3963 from ever-co/fix-ETP-67-bug-web-add-manual-time-modal-unexpected-closure-poor-ux Fix etp 67 bug web add manual time modal unexpected closure poor ux * Merge pull request #3958 from ever-co/ETP-57-bug-pending-invitations-list-is-hidden-when-theres-only-one-team-member [Fix bug] Show pending invitations even when the team has only one member * Feat etp 68 task web performance optimization for user profile task component (#3966) * refactor(web): optimize user profile task component and pagination logic - Enhanced the UserProfileTask component by introducing a new TaskList subcomponent to reduce re-renders and improve performance. - Implemented memoization techniques to optimize task filtering and badge class name calculations. - Updated the useScrollPagination hook to handle item initialization and scrolling more efficiently, ensuring smoother user experience during pagination. * refactor(web): enhance user profile task component with virtualization and memoization - Introduced advanced memoization techniques for task filtering to optimize performance. - Implemented TanStack Virtual for efficient rendering of large task lists, improving responsiveness. - Updated the UserProfileTask component to support virtualization and dynamic task updates. - Added a new useMemoizedCache hook for better cache management in task filtering operations. * refactor(web): enhance task filtering and virtualization for improved performance - Optimized task filtering logic with intelligent caching and memoization techniques. - Implemented window-based virtualization for large task lists to enhance rendering performance. - Updated UserProfileTask and UserTeamCard components to support new virtualization features. - Enhanced useTaskVirtualization hook to automatically choose between container and window virtualization based on task count. * fix(web): update scrolling indicator styling in user profile tasks component - Adjusted the height property of the scrolling indicator for better visual consistency. - Maintained existing styles while enhancing the overall appearance in dark mode. * refactor(web): introduce constant for virtualization threshold in user team card - Added ITEMS_LENGTH_TO_VIRTUALIZED constant to define the threshold for enabling virtualization in task lists. - Updated UserTeamCard component to utilize the new constant for improved maintainability and clarity in virtualization logic. * fix(web): improve daily plans loading state handling and task filtering - Updated DailyPlanTaskInfoCell to adjust task info cell width for better layout. - Enhanced UserProfilePlans component to implement loading state logic, ensuring daily plans display correctly during data fetching. - Fixed synchronization issue in useDailyPlan hook by changing the dependency to prevent premature empty state. - Improved task filtering logic in useTaskFilter to correctly extract tasks from daily plans, enabling full functionality in the task filter system. * feat(web): enhance daily plan header with delete functionality and layout improvements - Integrated delete plan functionality into the PlanHeader component for better user experience. - Updated layout logic to conditionally display the delete button based on user permissions and plan mode. - Refactored task time calculations for improved readability and performance. - Enhanced task filtering and display logic in the FutureTasks and OutstandingFilterDate components to align with new header features. * refactor(web): optimize task rendering in OutstandingFilterDate component - Introduced useMemo and useCallback for improved performance in the OutstandingFilterDate component. - Created optimized style objects and rendering functions to reduce unnecessary re-renders. - Simplified task rendering logic by extracting it into a dedicated function, enhancing code readability and maintainability. - Adjusted styles in the SelectComponent for better layout consistency. * style(web): update task content width in daily plan components - Added taskContentClassName to AllPlans, FutureTasks, and PastTasks components to standardize task content width. - Enhanced layout consistency across daily plan components for improved user experience. * style(web): enhance layout consistency in daily plan components - Updated taskContentClassName in AllPlans, FutureTasks, and PastTasks components for standardized card width. - Improved layout consistency across daily plan components to enhance user experience. - Refactored UserTeamActivity component for better alignment and spacing in the activity display. * feat(web): implement virtualization for user tasks in UserWorkedTaskTab - Enhanced UserWorkedTaskTab component to support virtualization for improved performance with large task lists. - Introduced VirtualizedList component to handle rendering of tasks efficiently, reducing re-renders and optimizing memory usage. - Added logic to conditionally use virtualization based on task count, improving user experience during task navigation. - Updated task rendering logic to maintain layout consistency while leveraging virtualization features. * feat(web): enhance virtualization performance in UserWorkedTaskTab and VirtualizedList - Updated UserWorkedTaskTab to improve task rendering with a larger buffer size and enhanced scrolling indicator for better user experience. - Refactored VirtualizedList to utilize dynamic configuration for cache size and overscan multiplier, optimizing performance for varying list sizes. - Introduced adaptive buffer zones that respond to scroll speed, reducing white space and improving visual continuity during scrolling. - Preserved original spacing structure in rendered items to maintain layout consistency across components. * feat(web): implement shared virtualization cache and enhance VirtualizedList performance - Introduced a shared virtualization cache to improve performance across multiple instances of VirtualizedList, allowing for efficient data retrieval and rendering. - Enhanced VirtualizedList to support dynamic pagination for large datasets, optimizing rendering based on item count and scroll direction. - Implemented debounced cache warming and improved buffer zone calculations to reduce visual artifacts during scrolling. - Updated virtualization configuration to adaptively manage cache size and overscan multiplier, enhancing user experience with large lists. * feat(web): enhance task rendering and introduce lazy loading in UserWorkedTaskTab - Updated UserWorkedTaskTab to utilize LazyTaskCard for improved performance and reduced initial load time. - Implemented memoization techniques with useCallback and useMemo to optimize rendering and prevent unnecessary re-renders. - Added LazyUserWorkedTaskTab for dynamic import of user tasks, enhancing user experience with lazy loading. - Introduced TaskCardBlockSKeleton for consistent loading states across task components. - Refactored VirtualizedList to support flexible renderItem signatures, improving compatibility with various item rendering functions. * feat(web): add UserTeamActivity component with lazy loading and skeleton support - Introduced LazyUserTeamActivity for dynamic import, enhancing performance by reducing initial load time. - Added UserTeamActivitySkeleton for consistent loading states while the component is being fetched. - Updated UserTeamCard to utilize LazyUserTeamActivity, improving user experience with lazy loading. - Refactored imports in user-team-card-activity to streamline component usage. * feat(web): refactor component imports for optimized loading and performance - Added new optimized components for lazy loading, consolidating imports for better performance across various pages. - Replaced direct dynamic imports with centralized imports from optimized-components, enhancing code maintainability. - Introduced new Tabs component for improved tabbed navigation in UserTeamActivity, streamlining the user interface. - Updated package.json to include @radix-ui/react-tabs for tab functionality. * chore(deps): update @radix-ui/react-tabs to version 1.1.12 in yarn.lock * feat(web): refactor component imports for optimized loading and performance - Consolidated dynamic imports into centralized optimized components for improved performance across various pages. - Replaced direct dynamic imports with imports from optimized-components, enhancing code maintainability and reducing initial load times. - Updated multiple components including calendar, dashboard, kanban, reports, and settings to utilize the new optimized imports. - Improved user experience by ensuring consistent loading states through skeleton components. * style(web): enhance styling in daily plan components for improved layout - Updated AccordionContent styles in AllPlans, FutureTasks, OutstandingFilterDate, and PastTasks components to include consistent padding and background color. - Improved visual consistency across daily plan components, enhancing overall user experience. * fix: spelling errors * feat(web): refactor page-component for optimized lazy loading and component imports - Updated page-component to utilize lazy loading for various team-related components, enhancing performance and reducing initial load times. - Consolidated imports from optimized-components, improving code maintainability and ensuring consistent loading states with skeleton components. - Removed deprecated optimized-components file to streamline the codebase. * feat(web): enhance drag-and-drop functionality in OutstandingFilterDate component - Introduced local state management with useState and useEffect to handle drag-and-drop operations more effectively. - Updated rendering logic to utilize the new local state for improved performance and consistency. - Ensured that the accordion component only opens the first item, aligning behavior with other tabs for a better user experience. * feat(web): enhance shared virtualization cache with cleanup and error handling - Added a cleanup interval to manage expired cache entries and prevent memory leaks. - Implemented a destroy method to clear resources when no instances are left. - Introduced error handling during instance registration and unregistration to improve robustness. - Added cleanup on page unload to ensure proper resource management. * fix: bots suggestions * feat(web): introduce OptimizedTaskAccordion component for enhanced task display - Added OptimizedTaskAccordion to display tasks in an accordion format, showing the first five tasks directly and the remaining tasks in a collapsible section. - Implemented intelligent caching and virtualization for improved performance with large task lists. - Updated UserWorkedTaskTab to utilize the new OptimizedTaskAccordion for better organization of tasks. - Enhanced README documentation to include details about the new component and its features. * feat(web): implement optimized activity tabs for improved performance - Introduced new components for optimized activity tabs: OptimizedScreenshotsTab, OptimizedAppsTab, OptimizedVisitedSitesTab, and OptimizedTasksTab, leveraging intelligent caching to enhance performance during tab switches. - Updated UserTeamActivity to utilize the new optimized tabs, replacing legacy components for better organization and efficiency. - Created a custom hook, useOptimizedActivityTabs, to manage caching and data retrieval for tasks, screenshots, apps, and visited sites. - Enhanced caching strategies in use-time-daily-activity and use-time-slots hooks for improved data management and reduced recalculation on tab switches. * refactor(web): improve task filtering and caching mechanisms - Updated task filtering logic in UserProfileTask to enhance readability. - Modified useTaskFilterCache to utilize specific task types for better type safety. - Refactored useEnhancedVirtualization to prevent memory leaks by caching only data, not React components, and optimized cache cleanup to avoid infinite re-renders. - Introduced helper functions for cache management in useEnhancedVirtualization, improving performance and usability. * fix(web): update EmptyPlans logic to prevent display when active tasks are present - Enhanced EmptyPlans component to accept an optional title prop for custom messages. - Modified task list logic to prevent showing EmptyPlans when there are active tasks, improving user experience and reducing confusion in task-related tabs. * refactor(web): enhance virtualization and error handling in task components (#3970) - Updated OptimizedTaskAccordion to improve task rendering and virtualization performance. - Modified VirtualizedList to include safety checks for virtual items, preventing runtime errors. - Implemented better error handling and validation in useTanStackVirtual and useEnhancedVirtualization hooks to ensure robust performance with large datasets. - Adjusted virtualization settings to optimize rendering and scrolling behavior, enhancing user experience. * [Feature] Support invitation-based onboarding for users without a workspace (#3961) * Add all necessary keys for i18 * fix auth layout * add registration form for invitee without wrkspc * fix build issues * add invitation expired message card * add workspace not found message card * add for validation & form submit handler * show conditionally the message card or complete registration form * redirect user to home page or create new workspace * update the invite callback URL -> accept-invite * support validateByCode & validateByToken query keys for invitations api calls * update invite schamas * redirect user to home page after accepting the invite * update user schema * add accept invite skelethon * add conditionnally tenantId and organizationId to the body * update i18 keys for invitation registration form * update i18 files * set password input auto complete to 'off' * add user email in the payload when accepting the invite * add a workspace loader after accept invite was successfull * clean up the accept invite page component * add on success callback for accept invitation mutation * fix spelling errors * fix build issues * update invite schemas * build(deps): bump linkifyjs from 4.3.1 to 4.3.2 (#3967) Bumps [linkifyjs](https://github.com/nfrasser/linkifyjs/tree/HEAD/packages/linkifyjs) from 4.3.1 to 4.3.2. - [Release notes](https://github.com/nfrasser/linkifyjs/releases) - [Changelog](https://github.com/nfrasser/linkifyjs/blob/main/CHANGELOG.md) - [Commits](https://github.com/nfrasser/linkifyjs/commits/v4.3.2/packages/linkifyjs) --- updated-dependencies: - dependency-name: linkifyjs dependency-version: 4.3.2 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * build(deps): bump form-data from 4.0.2 to 4.0.4 in /apps/mobile (#3968) Bumps [form-data](https://github.com/form-data/form-data) from 4.0.2 to 4.0.4. - [Release notes](https://github.com/form-data/form-data/releases) - [Changelog](https://github.com/form-data/form-data/blob/master/CHANGELOG.md) - [Commits](form-data/form-data@v4.0.2...v4.0.4) --- updated-dependencies: - dependency-name: form-data dependency-version: 4.0.4 dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * [Fix bug] Fix UI update for subscribed components after task mutation (#3969) * fix(tasks): update UI after task mutation * return the cache data shape after computing new cache data * fix task estimate update after mutation * fix types * fix build isses * add ai bot suggestions --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Thierry CH. <thierrybakera12@gmail.com> Co-authored-by: Arick Bulakali <85836702+NdekoCode@users.noreply.github.com> Co-authored-by: NdekoCode <arickbulakali@gmail.com>
Feat etp 68 task web performance optimization for user profile task component
How to Test This PR
Please explain clearly how to test the changes locally:
Example:
yarn web:devhttp://localhost:3030Screenshots (if needed)
Current screenshots
Screen.Recording.2025-07-30.at.12.38.12.mov
Related Issues
ETP-68 [Task]-Web Performance Optimization for UserProfileTask Component
Type of Change
✅ Checklist
Please confirm you did the following before asking for review:
Summary by CodeRabbit
New Features
Refactor
Bug Fixes
Chores
@radix-ui/react-tabspackage for new tab components.Style