Update/section progress bar issue #80
Open
Conversation
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
… of tracks and sections
…d success message functions
* main: NPM Dev(deps-dev): Bump @wordpress/scripts from 30.20.0 to 30.21.0 NPM Dev(deps-dev): Bump @wordpress/dom-ready from 4.27.0 to 4.28.0 NPM(deps): Bump @wordpress/api-fetch from 7.27.0 to 7.28.0 NPM Dev(deps-dev): Bump mini-css-extract-plugin from 2.9.2 to 2.9.3
|
I also made an update to the progress bar text so this failing a11y test should be fixed too: newfold-labs/wp-plugin-bluehost#406 |
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
This comment was marked as outdated.
This comment was marked as outdated.
Sorry, something went wrong.
…p main nextSteps component
…d simplify callbacks
There was a problem hiding this comment.
Pull Request Overview
This PR fixes a critical issue where the progress bar stopped working after PR #78. It implements dynamic progress bar updates when tasks are completed, optimizes API calls to prevent unnecessary hits on page load, and refactors the codebase for better maintainability using React hooks and immutability patterns.
- Fixes progress bar to dynamically update when task status changes
- Optimizes initial open state handling to prevent unnecessary API calls
- Refactors components with memoization and proper state management
Reviewed Changes
Copilot reviewed 19 out of 21 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
tests/cypress/integration/next-steps-widget.cy.js |
Updated test assertions to verify progress bar updates and success celebration |
tests/cypress/integration/next-steps-portal.cy.js |
Simplified test structure and removed redundant version handling tests |
src/components/track/index.js |
Added memo, useRef hooks, and improved initial state handling |
src/components/task/index.js |
Added memo, task status synchronization, and better error handling |
src/components/section/index.js |
Refactored with memo, progress data from props, and celebration logic |
src/components/progressBar/index.js |
Added memo wrapper for performance optimization |
src/components/nextSteps/styles.scss |
Enhanced celebration visibility conditions and text shadow |
src/components/nextSteps/index.js |
Major refactor with progress calculation, immutable state updates, and helper imports |
src/components/nextSteps/helpers.js |
New helper file with API functions and immutable state update utilities |
includes/StepsApi.php |
Updated API parameter names for consistency |
includes/PlanManager.php |
Changed default track open state to false |
| Build files | Updated compiled assets with new functionality |
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.
Proposed changes
After #78, the progress bar stopped working.
Earlier, a task update would essentially reload the whole app, but that PR fixed that. The progress bar wasn't set up to receive task updates, so this fixes the section component to dynamically update the progress bar.
While fixing, I also noticed the open endpoint was hit on load for every open section, so I updated that with some
useRefin each component for the initial open state. I also cleaned up components some more and then updated the test to verify that the progress bar updates when a task is completed and that when a section is complete, we see a success/celebration pane.Type of Change
Production
Development
Visual
Checklist
Further comments