Skip to content

Conversation

@MarielaTihova
Copy link
Contributor

Resolves #978

if(!progress) { return; }
this.circularProgress = progress;
const incrementProgress = () => {
setCurrentValue(currentValue + 10);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In react this is not the correct way to update a state based on its old value. There is a possibility that this introduces bugs depending on react change detection and rendering. You should do it like this:

const incrementProgress = () => {
  setCurrentValue((oldValue) => {
     const newValue = oldValue + 10;
     if (newValue > 100) {
       return 100;
     }
      return newValue;
   });
}

Or

const incrementProgress = () => {
    setCurrentValue(prev => Math.min(prev + 10, 100));
}

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@mddragnev a very elegant approach indeed! Thanks for catching that! 🙌

@mddragnev mddragnev merged commit c69a991 into vnext Jan 30, 2026
5 checks passed
@mddragnev mddragnev deleted the mtihova/circular-progress branch January 30, 2026 14:42
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Circular Progress - Gradient Progress Sample is not working

3 participants