From 4cda6eaf62f808f4398fae4aa226e50a480f587a Mon Sep 17 00:00:00 2001
From: EnixCoda <enixcoda@gmail.com>
Date: Thu, 2 Jun 2022 15:35:41 +0800
Subject: [PATCH] refactor: reduce config change callback change

---
 src/containers/ConfigsContext.tsx | 14 ++++++++++----
 1 file changed, 10 insertions(+), 4 deletions(-)

diff --git a/src/containers/ConfigsContext.tsx b/src/containers/ConfigsContext.tsx
index 4710a83..5dc6793 100644
--- a/src/containers/ConfigsContext.tsx
+++ b/src/containers/ConfigsContext.tsx
@@ -13,15 +13,21 @@ export function ConfigsContextWrapper(props: React.PropsWithChildren<Props>) {
   React.useEffect(() => {
     configHelper.get().then(setConfigs)
   }, [])
+
+  const everUpdatedRef = React.useRef(false)
+  React.useEffect(() => {
+    if (everUpdatedRef.current && configs) configHelper.set(configs)
+  }, [configs])
   const onChange = React.useCallback(
     (updatedConfigs: Partial<Config>) => {
-      const mergedConfigs = { ...configs, ...updatedConfigs } as Config
-      configHelper.set(mergedConfigs)
-      setConfigs(mergedConfigs)
+      everUpdatedRef.current = true
+      setConfigs(configs => (configs ? { ...configs, ...updatedConfigs } : configs))
     },
-    [configs, setConfigs],
+    [setConfigs],
   )
+
   if (configs === null) return null
+
   return (
     <ConfigsContext.Provider value={{ value: configs, onChange }}>
       {props.children}