refactor: replace recoil (#1137)

src/services/states.ts

@@ -1,73 +1,51 @@
-import { atom } from "recoil";
+import { createContextState } from "foxact/create-context-state";
+import { useLocalStorage } from "foxact/use-local-storage";
 
-export const atomThemeMode = atom<"light" | "dark">({
-  key: "atomThemeMode",
-  default: "light",
-});
+const [ThemeModeProvider, useThemeMode, useSetThemeMode] = createContextState<
+  "light" | "dark"
+>("light");
 
-export const atomLogData = atom<ILogItem[]>({
-  key: "atomLogData",
-  default: [],
-});
+const [LogDataProvider, useLogData, useSetLogData] = createContextState<
+  ILogItem[]
+>([]);
 
-export const atomEnableLog = atom<boolean>({
-  key: "atomEnableLog",
-  effects: [
-    ({ setSelf, onSet }) => {
-      const key = "enable-log";
-
-      try {
-        setSelf(localStorage.getItem(key) !== "false");
-      } catch {}
-
-      onSet((newValue, _, isReset) => {
-        try {
-          if (isReset) {
-            localStorage.removeItem(key);
-          } else {
-            localStorage.setItem(key, newValue.toString());
-          }
-        } catch {}
-      });
-    },
-  ],
-});
+export const useEnableLog = () => useLocalStorage("enable-log", true);
 
 interface IConnectionSetting {
   layout: "table" | "list";
 }
 
-export const atomConnectionSetting = atom<IConnectionSetting>({
-  key: "atomConnectionSetting",
-  effects: [
-    ({ setSelf, onSet }) => {
-      const key = "connections-setting";
+export const defaultConnectionSetting: IConnectionSetting = { layout: "table" };
 
-      try {
-        const value = localStorage.getItem(key);
-        const data = value == null ? { layout: "table" } : JSON.parse(value);
-        setSelf(data);
-      } catch {
-        setSelf({ layout: "table" });
-      }
-
-      onSet((newValue) => {
-        try {
-          localStorage.setItem(key, JSON.stringify(newValue));
-        } catch {}
-      });
-    },
-  ],
-});
+export const useConnectionSetting = () =>
+  useLocalStorage<IConnectionSetting>(
+    "connections-setting",
+    defaultConnectionSetting,
+    {
+      serializer: JSON.stringify,
+      deserializer: JSON.parse,
+    }
+  );
 
 // save the state of each profile item loading
-export const atomLoadingCache = atom<Record<string, boolean>>({
-  key: "atomLoadingCache",
-  default: {},
-});
+const [LoadingCacheProvider, useLoadingCache, useSetLoadingCache] =
+  createContextState<Record<string, boolean>>({});
 
 // save update state
-export const atomUpdateState = atom<boolean>({
-  key: "atomUpdateState",
-  default: false,
-});
+const [UpdateStateProvider, useUpdateState, useSetUpdateState] =
+  createContextState<boolean>(false);
+
+export {
+  ThemeModeProvider,
+  useThemeMode,
+  useSetThemeMode,
+  LogDataProvider,
+  useLogData,
+  useSetLogData,
+  LoadingCacheProvider,
+  useLoadingCache,
+  useSetLoadingCache,
+  UpdateStateProvider,
+  useUpdateState,
+  useSetUpdateState,
+};