From 33caa72447ef7384fe35645d1242f30d2b0b30d1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E4=BA=91=E6=B3=A5?= <1656081615@qq.com>
Date: Wed, 12 Jul 2023 09:25:24 +0800
Subject: [PATCH] refactor(createUseStorageState): adjust type of
 `defaultValue` and update docs (#2148)

* refactor(createUseStorageState): strong type and make the type of updater conform to doc

* test: update type

* refactor: simplify the usage of default value

* refactor: remove extra type

---------

Co-authored-by: lxr <1076629390@qq.com>
---
 .../createUseStorageState/__tests__/index.test.ts  |  5 ++---
 packages/hooks/src/createUseStorageState/index.ts  | 14 ++++----------
 .../hooks/src/useLocalStorageState/index.en-US.md  | 12 +++++++++++-
 .../hooks/src/useLocalStorageState/index.zh-CN.md  | 12 +++++++++++-
 4 files changed, 28 insertions(+), 15 deletions(-)

diff --git a/packages/hooks/src/createUseStorageState/__tests__/index.test.ts b/packages/hooks/src/createUseStorageState/__tests__/index.test.ts
index 152769b019..c115b3424f 100644
--- a/packages/hooks/src/createUseStorageState/__tests__/index.test.ts
+++ b/packages/hooks/src/createUseStorageState/__tests__/index.test.ts
@@ -1,5 +1,5 @@
 import { act, renderHook } from '@testing-library/react';
-import type { IFuncUpdater } from '../index';
+import type { Options } from '../index';
 import { createUseStorageState } from '../index';
 
 class TestStorage implements Storage {
@@ -41,9 +41,8 @@ class TestStorage implements Storage {
   }
 }
 
-interface StorageStateProps<T> {
+interface StorageStateProps<T> extends Pick<Options<T>, 'defaultValue'> {
   key: string;
-  defaultValue?: T | IFuncUpdater<T>;
 }
 
 describe('useStorageState', () => {
diff --git a/packages/hooks/src/createUseStorageState/index.ts b/packages/hooks/src/createUseStorageState/index.ts
index 4253cc936d..cf184ebd5a 100644
--- a/packages/hooks/src/createUseStorageState/index.ts
+++ b/packages/hooks/src/createUseStorageState/index.ts
@@ -1,20 +1,14 @@
-/* eslint-disable no-empty */
 import { useState } from 'react';
 import useMemoizedFn from '../useMemoizedFn';
 import useUpdateEffect from '../useUpdateEffect';
 import { isFunction, isUndef } from '../utils';
 
-export interface IFuncUpdater<T> {
-  (previousState?: T): T;
-}
-export interface IFuncStorage {
-  (): Storage;
-}
+export type SetState<S> = S | ((prevState?: S) => S);
 
 export interface Options<T> {
+  defaultValue?: T | (() => T);
   serializer?: (value: T) => string;
   deserializer?: (value: string) => T;
-  defaultValue?: T | IFuncUpdater<T>;
   onError?: (error: unknown) => void;
 }
 
@@ -63,13 +57,13 @@ export function createUseStorageState(getStorage: () => Storage | undefined) {
       return options.defaultValue;
     }
 
-    const [state, setState] = useState(() => getStoredValue());
+    const [state, setState] = useState(getStoredValue);
 
     useUpdateEffect(() => {
       setState(getStoredValue());
     }, [key]);
 
-    const updateState = (value?: T | IFuncUpdater<T>) => {
+    const updateState = (value?: SetState<T>) => {
       const currentState = isFunction(value) ? value(state) : value;
       setState(currentState);
 
diff --git a/packages/hooks/src/useLocalStorageState/index.en-US.md b/packages/hooks/src/useLocalStorageState/index.en-US.md
index 2ba8778b8f..940d23bcd3 100644
--- a/packages/hooks/src/useLocalStorageState/index.en-US.md
+++ b/packages/hooks/src/useLocalStorageState/index.en-US.md
@@ -26,18 +26,28 @@ A Hook that store state into localStorage.
 If you want to delete this record from localStorage, you can use `setState()` or `setState(undefined)`.
 
 ```typescript
+type SetState<S> = S | ((prevState?: S) => S);
+
 interface Options<T> {
   defaultValue?: T | (() => T);
   serializer?: (value: T) => string;
   deserializer?: (value: string) => T;
+  onError?: (error: unknown) => void;
 }
 
 const [state, setState] = useLocalStorageState<T>(
   key: string,
   options: Options<T>
-): [T?, (value?: T | ((previousState: T) => T)) => void];
+): [T?, (value?: SetState<T>) => void];
 ```
 
+### Result
+
+| Property | Description                 | Type                            |
+| -------- | --------------------------- | ------------------------------- |
+| state    | Local `localStorage` value  | `T`                             |
+| setState | Update `localStorage` value | `(value?: SetState<T>) => void` |
+
 ### Options
 
 | Property     | Description                   | Type                       | Default                       |
diff --git a/packages/hooks/src/useLocalStorageState/index.zh-CN.md b/packages/hooks/src/useLocalStorageState/index.zh-CN.md
index 55efed2589..752bf38a57 100644
--- a/packages/hooks/src/useLocalStorageState/index.zh-CN.md
+++ b/packages/hooks/src/useLocalStorageState/index.zh-CN.md
@@ -26,18 +26,28 @@ nav:
 如果想从 localStorage 中删除这条数据，可以使用 `setState()` 或 `setState(undefined)` 。
 
 ```typescript
+type SetState<S> = S | ((prevState?: S) => S);
+
 interface Options<T> {
   defaultValue?: T | (() => T);
   serializer?: (value: T) => string;
   deserializer?: (value: string) => T;
+  onError?: (error: unknown) => void;
 }
 
 const [state, setState] = useLocalStorageState<T>(
   key: string,
   options: Options<T>
-): [T?, (value?: T | ((previousState: T) => T)) => void];
+): [T?, (value?: SetState<T>) => void];
 ```
 
+### Result
+
+| 参数     | 说明                   | 类型                            |
+| -------- | ---------------------- | ------------------------------- |
+| state    | 本地 `localStorage` 值 | `T`                             |
+| setState | 设置 `localStorage` 值 | `(value?: SetState<T>) => void` |
+
 ### Options
 
 | 参数         | 说明               | 类型                       | 默认值                        |