Open
Conversation
This commit introduces a new feature for tracking and visualizing detailed lesson progress.
Key features and improvements:
- Detailed Lesson Progress Tracking:
- Introduced `LessonResult` and `LessonHistory` TypeScript types to store comprehensive lesson data (timestamp, WPM, accuracy, lesson title).
- Modified `src/pages/lessons/components/Finished.tsx` to capture and save this detailed `LessonResult` to `localStorage` as part of a
`LessonHistory` array after each lesson.
- Interactive Progress Graph:
- Created `src/pages/progress/components/ProgressGraph.tsx` to visualize `LessonHistory` data, integrated into `src/pages/progress/Progress.tsx
`.
- Implemented daily data aggregation in `ProgressGraph.tsx` to show only max WPM and accuracy per day.
- Configured the accuracy Y-axis scale to be fixed from 0 to 100%.
- Configured the WPM Y-axis to be variable depending on data.
- Configured the X-axis to show dates.
- Hidable Lesson History List:
- Created `src/pages/progress/components/ProgressHistoryList.tsx` to display a detailed list of all completed lesson stats.
- Added a toggle button in `src/pages/progress/Progress.tsx` to show/hide this list.
- Enhanced Progress Download/Upload:
- Modified `src/pages/progress/components/DownloadProgressButton.tsx` to include `LessonHistory` in the downloaded progress file.
- Updated `src/pages/progress/Progress.tsx`'s upload logic (`handleLoadProgress`) to support both old (`metWords` only) and new (`metWords` +
`lessonHistory`) file formats, ensuring backward compatibility.
- Updated the "Copy progress" button to copy the full progress data (`metWords` + `lessonHistory`) using a hidden textarea as a data source.
On branch better_progress_tracking
Changes to be committed:
modified: src/components/Chart/Axis.tsx
modified: src/components/FinishedSpeedChart.tsx
modified: src/components/PseudoContentButton.tsx
modified: src/pages/lessons/components/Finished.tsx
modified: src/pages/progress/Progress.tsx
modified: src/pages/progress/components/DownloadProgressButton.tsx
new file: src/pages/progress/components/ProgressGraph.tsx
new file: src/pages/progress/components/ProgressHistoryList.tsx
modified: src/types.ts
modified: src/utils/makeDownloadHref.ts
Owner
|
Thanks for proposing some changes. This is a bit too much to consider and discuss in 1 Pull Request. There are multiple parts for consideration worthy of their own issues, discussion, and pull requests. For example:
I suggest reading the CONTRIBUTING guidelines and using Issues to discuss significant features before creating pull requests. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Add Progress Graph and Enhanced Lesson History Tracking
This PR implements a comprehensive progress tracking system with visual analytics for the typey-type application.
What's Added
Progress Visualization
Enhanced Data Tracking
UI Improvements
Technical Changes
LessonResultandLessonHistoryFiles Modified
ProgressGraph.tsx,ProgressHistoryList.tsxImpact
The progress graph provides users with valuable insights into their typing improvement over time, while maintaining full backward compatibility with existing progress data.