feat(statistics): add days-until-application-end x-axis mode for appl… #1427
Conversation
…ication statistics - Add checkbox to toggle between calendar dates and days-until-application-end on x-axis - Default to days-until-application-end view for better comparison across programs - Update GraphQL query to include defaultApplicationEnd field - Implement proper cumulative chart logic that never decreases - Fill gaps with zeros to show all days in range without missing data - Sort program dropdown by applicationStart date (most recent first) - Update German translation: 'Nutze das Kalender-Datum auf der X-Achse' - Update English translation: 'Use Calendar Date on X-Axis' The new view allows comparing application patterns across different programs by showing how many days before the deadline applications were submitted.
|
You have run out of free Bugbot PR reviews for this billing cycle. This will reset on November 11. To receive reviews on all of your PRs, visit the Cursor dashboard to activate Pro and start your 14-day free trial. |
github-actions
bot
added
the
auto-updated
WalkthroughThe ApplicationStatistics component now supports dual visualization modes toggled via a checkbox. When enabled, charts display actual enrollment dates on the X-axis; when disabled, they show days-until-end calculations. The GraphQL query was updated to fetch the Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
frontend-nx/apps/edu-hub/queries/__generated__/MultiProgramEnrollments.tsis excluded by!**/__generated__/**
📒 Files selected for processing (4)
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx(5 hunks)frontend-nx/apps/edu-hub/locales/de/statistics.json(1 hunks)frontend-nx/apps/edu-hub/locales/en/statistics.json(1 hunks)frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (17)
frontend-nx/apps/edu-hub/locales/**/*.json
📄 CodeRabbit inference engine (.cursor/rules/frontend-component-patterns.mdc)
Add translations for user-facing text in the locales directory
Provide translations with German in 'Du' form and English fallbacks in locale JSON files
Files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
frontend-nx/apps/edu-hub/locales/{de,en}/*.json
📄 CodeRabbit inference engine (.cursor/rules/translation-implementation.mdc)
frontend-nx/apps/edu-hub/locales/{de,en}/*.json: Place translation files under frontend-nx/apps/edu-hub/locales/{language}/ with languages limited to de and en
Name translation files in PascalCase matching the related page/component (e.g., CourseContent.json)
All translation keys must use snake_case
Add new translations to both German and English files simultaneously
Maintain consistent grouping within the translation JSON structure
Files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
frontend-nx/apps/edu-hub/locales/en/*.json
📄 CodeRabbit inference engine (.cursor/rules/translation-implementation.mdc)
English translations should be clear, concise, and maintain consistent terminology
Files:
frontend-nx/apps/edu-hub/locales/en/statistics.json
frontend-nx/apps/edu-hub/queries/**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/database-table-creation.md)
Add GraphQL queries for the new table (list and by_pk) using Apollo gql in the queries directory
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
frontend-nx/apps/edu-hub/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/frontend-component-patterns.mdc)
frontend-nx/apps/edu-hub/**/*.{ts,tsx}: Use proper GraphQL query/mutation patterns with error handling (e.g., onError/onCompleted)
Add explicit TypeScript types for variables and functions
Use semicolons at the end of statements
Type GraphQL hooks with generics for results (e.g., useAdminQuery, useRoleMutation)
Always add proper error handling in async operations (e.g., try/catch, hook onError)
frontend-nx/apps/edu-hub/**/*.{ts,tsx}: Prefer useRoleQuery as the default hook for GraphQL reads; override role via context only when necessary
Handle mutation errors via onError and surface user-friendly feedback (e.g., ErrorMessageDialog)
Keep Apollo cache consistent after mutations using refetchQueries and/or cache update functions
Use optimisticResponse (with cache.modify as needed) to provide optimistic UI for suitable mutations
Type Apollo hooks with explicit generics for query/mutation result shapes and variables
Use pagination parameters (limit/offset) for list queries and implement proper loading states
frontend-nx/apps/edu-hub/**/*.{ts,tsx}: Use TypeScript strictly for all frontend components and interfaces (TypeScript-first)
Integrate GraphQL via Apollo Client with proper error handling around queries/mutations
Use the useTranslation hook with snake_case translation keys
Follow Material-UI design system patterns for UI components
frontend-nx/apps/edu-hub/**/*.{ts,tsx}: When using TableGrid, always pass the basic required props: data, columns, loading, and error
Define data row shapes with TypeScript interfaces when working with TableGrid
Use ColumnDef.size instead of legacy meta.width in TableGrid column definitions
Apply column sizing guidelines: 50–100px for status/icon, 80–150px for numeric, 200–500px for content, 100–200px for action columns
Provide meaningful, translated column headers when configuring TableGrid columns
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.tsfrontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.cursor/rules/performance-optimization.mdc)
**/*.{ts,tsx,js,jsx}: Use next/dynamic for code splitting of heavy components or features; avoid SSR for heavy client-only components
Prefer GraphQL fragments to avoid field duplication across queries
Use minimal list queries for lists and separate detailed queries for item views
Always paginate GraphQL list queries (limit/offset or cursor-based)
Use returnPartialData for faster UI response and avoid duplicate queries via notifyOnNetworkStatusChange=false when appropriate
Use GraphQL aggregation fields (e.g., *_aggregate count) instead of fetching entire related collections to compute counts
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.tsfrontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/**/queries/**/*.{ts,tsx,graphql}
📄 CodeRabbit inference engine (.cursor/rules/table-grid-advanced-patterns.mdc)
When querying lists for TableGrid, include both the collection and an aggregate count field to compute totalCount
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/table-grid-column-configuration.mdc)
**/*.{ts,tsx}: Use modern TanStack Table sizing properties: size (px), and add minSize/maxSize as needed for TableGrid columns
Do not use legacy meta.width in column definitions; replace meta: { width: X } with size: X*100 and remove meta.width
Ensure column size constraints are valid (minSize <= maxSize) and realistic
Apply recommended width ranges by content type: Status/Icon 50–100px; Numeric 80–150px; Content 200–500px; Actions 100–200px
Use semantic, translated column headers (e.g., t('...') where applicable)
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.tsfrontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/**/*.@(ts|tsx)
📄 CodeRabbit inference engine (.cursor/rules/translation-implementation.mdc)
frontend-nx/apps/edu-hub/**/*.@(ts|tsx): Use useTranslation with a namespace matching the translation filename (e.g., useTranslation('course') for course.json)
When accessing keys with special characters (e.g., dots/commas), use returnObjects and bracket notation
Provide fallbacks for missing translations and check if a translation exists before use
Use the count parameter for pluralization with t()
Files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.tsfrontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/locales/de/*.json
📄 CodeRabbit inference engine (.cursor/rules/translation-implementation.mdc)
German translations must always use informal “Du” and must never use formal “Sie/Ihnen/Ihre”
Files:
frontend-nx/apps/edu-hub/locales/de/statistics.json
frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/frontend-component-patterns.mdc)
frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx: Define a dedicated TypeScript interface for each component’s props and type the component as React.FC
Use useTranslation for all user-facing text
Include proper error boundaries for error handling in React components
Follow Material-UI patterns for consistent styling
Include explicit loading states for async operations in components/pages
Use useCallback for event handlers and useMemo for expensive calculations
Type React state with explicit generics in useState (e.g., useState, useState<DataType|null>)
Export components as default unless multiple exports are needed
Use existing standard components (ErrorMessageDialog, QuestionConfirmationDialog, BaseDialog, NotificationSnackbar, CreatableTagSelector, DropDownSelector, InputField, TableGrid, Button) instead of creating new ones
When extending functionality, prefer extending existing components with additional props rather than duplicating components
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/components/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/frontend-component-patterns.mdc)
Place new shared components under frontend-nx/apps/edu-hub/components/ following existing patterns
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/components/**
📄 CodeRabbit inference engine (.cursor/rules/overview.mdc)
Organize UI code feature-first under frontend-nx/apps/edu-hub/components/, using common/, inputs/, and pages/ subfolders
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/overview.mdc)
frontend-nx/apps/edu-hub/components/**/*.{ts,tsx}: Use ErrorMessageDialog, QuestionConfirmationDialog, and NotificationSnackbar for errors, confirmations, and notifications
Use the TableGrid component for data tables with pagination, sorting, and filtering
Use CreatableTagSelector, DropDownSelector, and InputField for form inputs
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
**/*.{tsx,jsx}
📄 CodeRabbit inference engine (.cursor/rules/performance-optimization.mdc)
**/*.{tsx,jsx}: Use useMemo for expensive calculations inside React components
Use useCallback to memoize event handlers and callbacks passed to child components
Wrap components with React.memo when rendering is expensive or props are stable
Provide a custom comparison function to React.memo when component props are complex
Lazy load heavy components using React.lazy and Suspense
Use reasonable page sizes and pagination for large datasets rendered in TableGrid
Use virtual scrolling or windowing for very large lists instead of rendering all items
Use Next.js Image component for optimized images instead offor app images
Preload critical images and fonts using for improved initial load performance
Wrap components with React Profiler in performance investigations to capture render timings
Avoid inline functions in render where they cause unnecessary re-renders; prefer memoized callbacks
Provide loading states and Suspense fallbacks to avoid heavy synchronous rendering and improve perceived performance
Do not render large lists without pagination or virtualization
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
frontend-nx/apps/edu-hub/**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/table-grid-basic-usage.mdc)
frontend-nx/apps/edu-hub/**/*.tsx: Provide all required pagination props to TableGrid when paginating: totalCount, pageIndex, onPageChange, pageSize, onPageSizeChange
Reset pageIndex to 0 when pageSize changes in TableGrid pagination handlers
Do not manage offset manually; rely on TableGrid’s built-in pagination
Do not hardcode page sizes; make them configurable via availablePageSizes or external config
Memoize TableGrid column definitions (e.g., with useMemo) to avoid unnecessary re-renders
Handle loading and error states properly: pass loading and error to TableGrid and render an ErrorMessageDialog on error
Wire up search by providing searchFilter and onSearchFilterChange when enabling TableGrid’s global search
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/table-grid-column-configuration.mdc)
**/*.tsx: Memoize column definitions with useMemo for static columns to prevent unnecessary re-renders
Include correct dependencies in useMemo when columns depend on component state/props
Provide accessible ARIA labels for action buttons inside cell renderers (e.g., aria-label on Edit/Delete)
Consider mobile responsiveness: hide non-essential columns on small screens via CSS utilities/media queries
Files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
🧠 Learnings (40)
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/**/*.json : Add translations for user-facing text in the locales directory
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/*.json : Add new translations to both German and English files simultaneously
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/*.json : Maintain consistent grouping within the translation JSON structure
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/en/*.json : English translations should be clear, concise, and maintain consistent terminology
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.json
📚 Learning: 2025-09-23T21:49:54.881Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-basic-usage.mdc:0-0
Timestamp: 2025-09-23T21:49:54.881Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Provide meaningful, translated column headers when configuring TableGrid columns
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/course.json : Organize course translations in course.json using logical groups (general, ects, degree_elements, learning, sessions, attendances, achievement, registration, status, modal, errors)
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:45:34.012Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/overview.mdc:0-0
Timestamp: 2025-09-23T21:45:34.012Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/**/*.json : Provide translations with German in 'Du' form and English fallbacks in locale JSON files
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/*.json : Place translation files under frontend-nx/apps/edu-hub/locales/{language}/ with languages limited to de and en
Applied to files:
frontend-nx/apps/edu-hub/locales/en/statistics.jsonfrontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:41:02.333Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/database-table-creation.md:0-0
Timestamp: 2025-09-23T21:41:02.333Z
Learning: Applies to frontend-nx/apps/edu-hub/queries/**/*.ts : Add GraphQL queries for the new table (list and by_pk) using Apollo gql in the queries directory
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Use proper GraphQL query/mutation patterns with error handling (e.g., onError/onCompleted)
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:45:34.012Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/overview.mdc:0-0
Timestamp: 2025-09-23T21:45:34.012Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Integrate GraphQL via Apollo Client with proper error handling around queries/mutations
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/queries/fragments/*.ts : Place reusable GraphQL fragments under frontend-nx/apps/edu-hub/queries/fragments
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/queries/queries/*.ts : Place read GraphQL queries under frontend-nx/apps/edu-hub/queries/queries
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/queries/mutations/*.ts : Place write GraphQL mutations under frontend-nx/apps/edu-hub/queries/mutations
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Prefer useRoleQuery as the default hook for GraphQL reads; override role via context only when necessary
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Type Apollo hooks with explicit generics for query/mutation result shapes and variables
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:49:12.600Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-advanced-patterns.mdc:0-0
Timestamp: 2025-09-23T21:49:12.600Z
Learning: Applies to frontend-nx/apps/edu-hub/**/queries/**/*.{ts,tsx,graphql} : When querying lists for TableGrid, include both the collection and an aggregate count field to compute totalCount
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Type GraphQL hooks with generics for results (e.g., useAdminQuery<QueryResult>, useRoleMutation<MutationResult>)
Applied to files:
frontend-nx/apps/edu-hub/queries/multiProgramEnrollments.ts
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/*.json : Name translation files in PascalCase matching the related page/component (e.g., CourseContent.json)
Applied to files:
frontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/de/*.json : German translations must always use informal “Du” and must never use formal “Sie/Ihnen/Ihre”
Applied to files:
frontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/locales/{de,en}/*.json : All translation keys must use snake_case
Applied to files:
frontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:49:54.881Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-basic-usage.mdc:0-0
Timestamp: 2025-09-23T21:49:54.881Z
Learning: Applies to locales/{de,en}/common.json : Ensure required translation keys for TableGrid exist: common:table_grid.items_per_page and common:table_grid.pagination_text
Applied to files:
frontend-nx/apps/edu-hub/locales/de/statistics.json
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Use useCallback for event handlers and useMemo for expensive calculations
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Type React state with explicit generics in useState (e.g., useState<boolean>, useState<DataType|null>)
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:45:34.012Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/overview.mdc:0-0
Timestamp: 2025-09-23T21:45:34.012Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Follow Material-UI design system patterns for UI components
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Add explicit TypeScript types for variables and functions
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Follow Material-UI patterns for consistent styling
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:49:54.881Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-basic-usage.mdc:0-0
Timestamp: 2025-09-23T21:49:54.881Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.tsx : Provide all required pagination props to TableGrid when paginating: totalCount, pageIndex, onPageChange, pageSize, onPageSizeChange
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:49:54.881Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-basic-usage.mdc:0-0
Timestamp: 2025-09-23T21:49:54.881Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.tsx : Do not manage offset manually; rely on TableGrid’s built-in pagination
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Include explicit loading states for async operations in components/pages
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:49:54.881Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/table-grid-basic-usage.mdc:0-0
Timestamp: 2025-09-23T21:49:54.881Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.tsx : Memoize TableGrid column definitions (e.g., with useMemo) to avoid unnecessary re-renders
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:44:18.529Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/graphql-integration-patterns.mdc:0-0
Timestamp: 2025-09-23T21:44:18.529Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.{ts,tsx} : Use optimisticResponse (with cache.modify as needed) to provide optimistic UI for suitable mutations
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Use useTranslation for all user-facing text
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Use existing standard components (ErrorMessageDialog, QuestionConfirmationDialog, BaseDialog, NotificationSnackbar, CreatableTagSelector, DropDownSelector, InputField, TableGrid, Button) instead of creating new ones
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:46:24.394Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/performance-optimization.mdc:0-0
Timestamp: 2025-09-23T21:46:24.394Z
Learning: Applies to **/*.{tsx,jsx} : Use useCallback to memoize event handlers and callbacks passed to child components
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:39:49.574Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/component-architecture.mdc:0-0
Timestamp: 2025-09-23T21:39:49.574Z
Learning: Applies to components/**/*.{ts,tsx} : Memoize expensive computations with useMemo and event handlers with useCallback
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:39:49.574Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/component-architecture.mdc:0-0
Timestamp: 2025-09-23T21:39:49.574Z
Learning: Applies to components/**/*.{ts,tsx} : Manage server state via GraphQL/Apollo hooks and derive computed values with useMemo
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:42:37.813Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/frontend-component-patterns.mdc:0-0
Timestamp: 2025-09-23T21:42:37.813Z
Learning: Applies to frontend-nx/apps/edu-hub/{components,pages}/**/*.tsx : Define a dedicated TypeScript interface for each component’s props and type the component as React.FC<Props>
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:46:24.394Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/performance-optimization.mdc:0-0
Timestamp: 2025-09-23T21:46:24.394Z
Learning: Applies to **/*.{tsx,jsx} : Use useMemo for expensive calculations inside React components
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
📚 Learning: 2025-09-23T21:52:19.160Z
Learnt from: CR
PR: eduhub-org/eduhub#0
File: .cursor/rules/translation-implementation.mdc:0-0
Timestamp: 2025-09-23T21:52:19.160Z
Learning: Applies to frontend-nx/apps/edu-hub/**/*.@(ts|tsx) : Use useTranslation with a namespace matching the translation filename (e.g., useTranslation('course') for course.json)
Applied to files:
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
⏰ 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). (2)
- GitHub Check: build (18.x)
- GitHub Check: build (18.x)
| programListData?.Program | ||
| .slice() // Create a copy to avoid mutating the original array | ||
| .sort((a, b) => { | ||
| // Sort by applicationStart in descending order (most recent/future first) | ||
| // Programs without applicationStart go to the end | ||
| if (!a.applicationStart && !b.applicationStart) return 0; | ||
| if (!a.applicationStart) return 1; | ||
| if (!b.applicationStart) return -1; | ||
|
|
||
| const dateA = new Date(a.applicationStart).getTime(); | ||
| const dateB = new Date(b.applicationStart).getTime(); | ||
| return dateB - dateA; // Descending order: future/recent dates first | ||
| }) | ||
| .map((program) => ({ | ||
| id: program.id, | ||
| name: program.title, | ||
| })) || [], |
There was a problem hiding this comment.
Fix crash when program list is still loading.
While the program list query is pending, programListData is undefined. The expression programListData?.Program.slice() still attempts to call .slice() on undefined, throwing a TypeError and preventing the component from rendering. Guard the method call with optional chaining (or fallback to an empty array) before sorting/mapping.
- programListData?.Program
- .slice() // Create a copy to avoid mutating the original array
+ programListData?.Program?.slice() // Create a copy to avoid mutating the original array
.sort((a, b) => {📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| programListData?.Program | |
| .slice() // Create a copy to avoid mutating the original array | |
| .sort((a, b) => { | |
| // Sort by applicationStart in descending order (most recent/future first) | |
| // Programs without applicationStart go to the end | |
| if (!a.applicationStart && !b.applicationStart) return 0; | |
| if (!a.applicationStart) return 1; | |
| if (!b.applicationStart) return -1; | |
| const dateA = new Date(a.applicationStart).getTime(); | |
| const dateB = new Date(b.applicationStart).getTime(); | |
| return dateB - dateA; // Descending order: future/recent dates first | |
| }) | |
| .map((program) => ({ | |
| id: program.id, | |
| name: program.title, | |
| })) || [], | |
| (programListData?.Program ?? []) | |
| .slice() // Create a copy to avoid mutating the original array | |
| .sort((a, b) => { | |
| // Sort by applicationStart in descending order (most recent/future first) | |
| // Programs without applicationStart go to the end | |
| if (!a.applicationStart && !b.applicationStart) return 0; | |
| if (!a.applicationStart) return 1; | |
| if (!b.applicationStart) return -1; | |
| const dateA = new Date(a.applicationStart).getTime(); | |
| const dateB = new Date(b.applicationStart).getTime(); | |
| return dateB - dateA; // Descending order: future/recent dates first | |
| }) | |
| .map((program) => ({ | |
| id: program.id, | |
| name: program.title, | |
| })) || [], |
🤖 Prompt for AI Agents
In
frontend-nx/apps/edu-hub/components/pages/StatisticsContent/statistics/ApplicationStatistics.tsx
around lines 32 to 48, the code calls .slice() on programListData?.Program which
can be undefined while the query is loading, causing a TypeError; change the
pipeline to operate on a safe array by using a fallback before calling slice
(e.g., (programListData?.Program ?? []) or programListData?.Program ?? []), then
perform .slice(), .sort(), and .map() on that guaranteed array so the component
won’t crash when programListData is undefined.
Summary by CodeRabbit
New Features
Localization