-
Notifications
You must be signed in to change notification settings - Fork 2
Add react utils hook useInterval #10
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
commit: |
There was a problem hiding this 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.
src/lib/hooks/useInterval.ts
Outdated
console.log("Starting interval", isRunning); | ||
if (isRunning) { | ||
startInterval(); | ||
} | ||
return stopInterval; | ||
}, [callback, isRunning, interval, startInterval, stopInterval]); | ||
|
Copilot
AI
Aug 29, 2025
There was a problem hiding this comment.
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.
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.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@neotrow is this accurate?
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>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
overall looking good, the word "poll" is still occuring a lot, can you replace the comments accordingly everywhere?
Thanks 🙏
…react-utils into feature/usepollinghook
Add react utils hook useInterval from issue #6