Skip to content

Conversation

dom-baur
Copy link

@dom-baur dom-baur commented Aug 29, 2025

Add react utils hook useInterval from issue #6

Copy link

pkg-pr-new bot commented Aug 29, 2025

Open in StackBlitz

npm i https://pkg.pr.new/neolution-ch/react-utils/@neolution-ch/react-utils@10

commit: ac3da6c

@dom-baur dom-baur changed the title Add react utils hook usePolling Add react utils hook useInterval Aug 29, 2025
@neoscie neoscie requested a review from Copilot August 29, 2025 09:50
Copy link

@Copilot Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull Request Overview

This PR introduces a new React utility hook useInterval that provides a declarative way to manage JavaScript intervals with start/stop controls and auto-start functionality.

Key changes:

  • Implements a custom React hook with TypeScript interfaces for managing intervals
  • Adds comprehensive Cypress component tests covering various interval scenarios
  • Updates the changelog to document the new feature

Reviewed Changes

Copilot reviewed 3 out of 4 changed files in this pull request and generated 6 comments.

File Description
src/lib/hooks/useInterval.ts Core implementation of the useInterval hook with TypeScript interfaces
cypress/component/useInterval.cy.tsx Comprehensive test suite covering autostart, manual control, and edge cases
CHANGELOG.md Documents the addition of the new useInterval hook

Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.

Comment on lines 68 to 74
console.log("Starting interval", isRunning);
if (isRunning) {
startInterval();
}
return stopInterval;
}, [callback, isRunning, interval, startInterval, stopInterval]);

Copy link

Copilot AI Aug 29, 2025

Choose a reason for hiding this comment

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

This useEffect could cause infinite re-renders. The cleanup function stopInterval is returned but the effect depends on stopInterval itself, and calling startInterval inside the effect when isRunning is true could trigger the effect again. Consider restructuring to avoid this dependency cycle.

Suggested change
console.log("Starting interval", isRunning);
if (isRunning) {
startInterval();
}
return stopInterval;
}, [callback, isRunning, interval, startInterval, stopInterval]);
if (isRunning) {
if (!intervalRef.current || intervalRef.current === -1) {
intervalRef.current = window.setInterval(() => {
callbackRef.current();
}, interval);
}
} else {
if (intervalRef.current && intervalRef.current !== -1) {
window.clearInterval(intervalRef.current);
intervalRef.current = -1;
}
}
return () => {
if (intervalRef.current && intervalRef.current !== -1) {
window.clearInterval(intervalRef.current);
intervalRef.current = -1;
}
};
}, [callback, isRunning, interval]);

Copilot uses AI. Check for mistakes.

Copy link

Choose a reason for hiding this comment

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

@neotrow is this accurate?

neoscie and others added 3 commits August 29, 2025 11:52
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Copy link
Contributor

@neotrow neotrow left a comment

Choose a reason for hiding this comment

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

@dom-baur

overall looking good, the word "poll" is still occuring a lot, can you replace the comments accordingly everywhere?

Thanks 🙏

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants