diff --git a/README.md b/README.md
index cc1728fafd..c53ee4d926 100644
--- a/README.md
+++ b/README.md
@@ -118,11 +118,11 @@
- [`useLifecycles`](./docs/useLifecycles.md) — calls `mount` and `unmount` callbacks.
- [`useMountedState`](./docs/useMountedState.md) and [`useUnmountPromise`](./docs/useUnmountPromise.md) — track if component is mounted.
- [`usePromise`](./docs/usePromise.md) — resolves promise only while component is mounted.
- - [`useLogger`](./docs/useLogger.md) — logs in console as component goes through life-cycles.
+ - [`useLogger`](./docs/useLogger.md) — logs in console as component goes through lifecycles.
- [`useMount`](./docs/useMount.md) — calls `mount` callbacks.
- [`useUnmount`](./docs/useUnmount.md) — calls `unmount` callbacks.
- [`useUpdateEffect`](./docs/useUpdateEffect.md) — run an `effect` only on updates.
- - [`useIsomorphicLayoutEffect`](./docs/useIsomorphicLayoutEffect.md) — `useLayoutEffect` that that works on server.
+ - [`useIsomorphicLayoutEffect`](./docs/useIsomorphicLayoutEffect.md) — `useLayoutEffect` that works on server.
- [`useDeepCompareEffect`](./docs/useDeepCompareEffect.md), [`useShallowCompareEffect`](./docs/useShallowCompareEffect.md), and [`useCustomCompareEffect`](./docs/useCustomCompareEffect.md)
@@ -142,13 +142,13 @@
- [`useStateList`](./docs/useStateList.md) — circularly iterates over an array. [![][img-demo]](https://codesandbox.io/s/bold-dewdney-pjzkd)
- [`useToggle` and `useBoolean`](./docs/useToggle.md) — tracks state of a boolean. [![][img-demo]](https://codesandbox.io/s/focused-sammet-brw2d)
- [`useCounter` and `useNumber`](./docs/useCounter.md) — tracks state of a number. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usecounter--demo)
- - [`useList`](./docs/useList.md) ~and [`useUpsert`](./docs/useUpsert.md)~ — tracks state of an array. [![][img-demo]](https://codesandbox.io/s/wonderful-mahavira-1sm0w)
+ - [`useList`](./docs/useList.md) — tracks state of an array. [![][img-demo]](https://codesandbox.io/s/wonderful-mahavira-1sm0w)
- [`useMap`](./docs/useMap.md) — tracks state of an object. [![][img-demo]](https://codesandbox.io/s/quirky-dewdney-gi161)
- [`useSet`](./docs/useSet.md) — tracks state of a Set. [![][img-demo]](https://codesandbox.io/s/bold-shtern-6jlgw)
- [`useQueue`](./docs/useQueue.md) — implements simple queue.
- [`useStateValidator`](./docs/useStateValidator.md) — tracks state of an object. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usestatevalidator--demo)
- [`useStateWithHistory`](./docs/useStateWithHistory.md) — stores previous state values and provides handles to travel through them. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usestatewithhistory--demo)
- - [`useMultiStateValidator`](./docs/useMultiStateValidator.md) — alike the `useStateValidator`, but tracks multiple states at a time. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemultistatevalidator--demo)
+ - [`useMultiStateValidator`](./docs/useMultiStateValidator.md) — like the `useStateValidator`, but tracks multiple states at a time. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemultistatevalidator--demo)
- [`useMediatedState`](./docs/useMediatedState.md) — like the regular `useState` but with mediation by custom function. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usemediatedstate--demo)
- [`useFirstMountState`](./docs/useFirstMountState.md) — check if current render is first. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-usefirstmountstate--demo)
- [`useRendersCount`](./docs/useRendersCount.md) — count component renders. [![][img-demo]](https://streamich.github.io/react-use/?path=/story/state-userenderscount--demo)
diff --git a/docs/useList.md b/docs/useList.md
index caffe42f6b..fdcc23ace8 100644
--- a/docs/useList.md
+++ b/docs/useList.md
@@ -70,4 +70,4 @@ const [list, {
## Related hooks
-- [useUpsert](./useUpsert.md)
+
diff --git a/docs/useUpsert.md b/docs/useUpsert.md
index 25fe7d71fd..ab9403774c 100644
--- a/docs/useUpsert.md
+++ b/docs/useUpsert.md
@@ -1,9 +1,25 @@
# `useUpsert`
-> DEPRECATED!
-> Use `useList` hook's upsert action instead
+> **⚠️ DEPRECATED**
+> This hook is deprecated and will be removed in a future version.
+> Use `useList` hook's `upsert` action instead.
-Superset of [`useList`](./useList.md). Provides an additional method to upsert (update or insert) an element into the list.
+This hook was a superset of [`useList`](./useList.md) that provided an additional method to upsert (update or insert) an element into the list. The same functionality is now available directly in `useList`.
+
+## Migration Guide
+
+Replace:
+```jsx
+import { useUpsert } from 'react-use';
+const [list, { set, upsert, remove }] = useUpsert(comparisonFunction, initialItems);
+```
+
+With:
+```jsx
+import { useList } from 'react-use';
+const [list, { set, upsert, removeAt }] = useList(initialItems);
+// Use upsert(comparisonFunction, newItem) instead of upsert(newItem)
+```
## Usage
diff --git a/src/useUpsert.ts b/src/useUpsert.ts
index 2fdb3d8fc3..cb3a58f006 100644
--- a/src/useUpsert.ts
+++ b/src/useUpsert.ts
@@ -12,6 +12,13 @@ export default function useUpsert(
predicate: (a: T, b: T) => boolean,
initialList: IHookStateInitAction = []
): [T[], UpsertListActions] {
+ if (process.env.NODE_ENV !== 'production') {
+ console.warn(
+ 'useUpsert is deprecated and will be removed in a future version. ' +
+ 'Use useList hook\'s upsert action instead. ' +
+ 'See: https://github.com/streamich/react-use/blob/master/docs/useUpsert.md'
+ );
+ }
const [list, listActions] = useList(initialList);
return [
diff --git a/tests/useNetworkState.test.ts b/tests/useNetworkState.test.ts
index 93c583aac0..eaf036e5db 100644
--- a/tests/useNetworkState.test.ts
+++ b/tests/useNetworkState.test.ts
@@ -1,7 +1,7 @@
import { renderHook } from '@testing-library/react-hooks';
import { useNetworkState } from '../src';
-//ToDo: improve tests
+// TODO: Add comprehensive tests for network state changes, offline/online events, and network information properties
describe(`useNetworkState`, () => {
it('should be defined', () => {
expect(useNetworkState).toBeDefined();