Feat/compt 32 async lifecycle hooks

[a-elkhiraooui-ciscode]

Summary

• What does this PR change?

Why

• Why is this change needed?

Checklist

• Added/updated tests (if behavior changed)
• npm run lint passes
• npm run typecheck passes
• npm test passes
• npm run build passes
• Added a changeset (npx changeset) if this affects consumers

Notes

• Anything reviewers should pay attention to?

[sonarqubecloud]

Quality Gate passed

Issues
4 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud

[Copilot]

Pull request overview

Adds a new “Async & Lifecycle” set of hooks to the HooksKit package, along with tests and public exports.

Changes:

• Introduces five new hooks: usePrevious, useToggle, useInterval, useTimeout, useIsFirstRender
• Exports the new hooks from the hooks barrel (src/hooks/index.ts) so they’re available via src/index.ts
• Adds Vitest coverage for the new hooks and a changeset entry for a minor release

Reviewed changes

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

Show a summary per file

File	Description
src/hooks/useToggle.ts	New boolean toggle hook with stable callback
src/hooks/useTimeout.ts	New timeout hook (delay-controlled)
src/hooks/usePrevious.ts	New previous-value hook
src/hooks/useIsFirstRender.ts	New first-render detection hook
src/hooks/useInterval.ts	New interval hook (delay-controlled)
src/hooks/index.ts	Exports the newly added hooks
src/hooks/tests/useToggle.test.ts	Adds tests for useToggle
src/hooks/tests/useTimeout.test.ts	Adds tests for useTimeout
src/hooks/tests/usePrevious.test.ts	Adds tests for usePrevious
src/hooks/tests/useIsFirstRender.test.ts	Adds tests for useIsFirstRender
src/hooks/tests/useInterval.test.ts	Adds tests for useInterval
.github/instructions/copilot-instructions.md	Updates hook group documentation (currently contains a merge conflict marker)
.changeset/COMPT-32-async-lifecycle-hooks.md	Declares a minor release and documents the new hooks

[Copilot]

This hook mutates ref.current during render. In React 18 StrictMode/concurrent rendering, render can be invoked multiple times before commit; this can cause the initial mount to return false on the second render pass. Prefer setting the ref in an effect (e.g., flip a mounted flag in useEffect([]) / useLayoutEffect([])) and only reading it during render.

Suggested change

	import { useRef } from 'react';
	export function useIsFirstRender(): boolean {
	const isFirstRender = useRef(true);
	// Reading and writing ref.current during render is intentional here:
	// isFirstRender tracks mount state only and never drives output directly.
	/* eslint-disable react-hooks/refs */
	if (isFirstRender.current) {
	isFirstRender.current = false;
	return true;
	}
	/* eslint-enable react-hooks/refs */
	return false;
	import { useEffect, useRef } from 'react';
	export function useIsFirstRender(): boolean {
	const isFirstRender = useRef(true);
	useEffect(() => {
	isFirstRender.current = false;
	}, []);
	return isFirstRender.current;

[Copilot]

useInterval uses window.setInterval/window.clearInterval without a typeof window === 'undefined' guard. Other hooks in this package guard window access (e.g., src/hooks/useWindowSize.ts:16-18), and using window here will throw in non-browser runtimes (React Native, some test runners). Prefer globalThis.setInterval/clearInterval (or setInterval/clearInterval) or add a window guard for consistency.

[Copilot]

useTimeout uses window.setTimeout/window.clearTimeout without a typeof window === 'undefined' guard. Other hooks in this package guard window access (e.g., src/hooks/useWindowSize.ts:16-18), and using window here will throw in non-browser runtimes. Prefer globalThis.setTimeout/clearTimeout (or setTimeout/clearTimeout) or add a window guard for consistency.

Suggested change

	const id = window.setTimeout(() => {
	callbackRef.current();
	}, delay);
	return () => {
	window.clearTimeout(id);
	const id = setTimeout(() => {
	callbackRef.current();
	}, delay);
	return () => {
	clearTimeout(id);

[Copilot]

Test files for existing hooks are colocated in src/hooks (e.g., src/hooks/useDebounce.test.ts, src/hooks/useWindowSize.test.ts). These new tests live under src/hooks/__tests__, which is inconsistent and makes the test layout harder to scan. Consider colocating these tests alongside the corresponding hook files for consistency.

Suggested change

	import { useToggle } from '../useToggle';
	import { useToggle } from './useToggle';

[Copilot]

The file contains an unresolved merge conflict marker (<<<<<<< HEAD). This will break the markdown/instructions and should be resolved (remove conflict markers and keep the intended content).

Suggested change

<<<<<<< HEAD

[Copilot]

usePrevious calls setState during render based on curr !== value. This comparison is not safe for all values (e.g., NaN !== NaN), which can trigger an infinite render loop. Consider switching to a ref+effect implementation, or at minimum use Object.is(curr, value) for the comparison to avoid NaN edge cases.

Suggested change

	import { useState } from 'react';
	export function usePrevious<T>(value: T): T | undefined {
	const [[prev, curr], setState] = useState<[T | undefined, T]>([undefined, value]);
	if (curr !== value) {
	setState([curr, value]);
	}
	return prev;
	import { useEffect, useRef } from 'react';
	export function usePrevious<T>(value: T): T | undefined {
	const currentRef = useRef<T | undefined>(undefined);
	const previousRef = useRef<T | undefined>(undefined);
	useEffect(() => {
	previousRef.current = currentRef.current;
	currentRef.current = value;
	}, [value]);
	return previousRef.current;