refactor: use redux

web/src/services/memoService.ts

@@ -1,99 +1,92 @@
 import api from "../helpers/api";
 import { TAG_REG } from "../helpers/consts";
 import utils from "../helpers/utils";
-import appStore from "../stores/appStore";
+import { patchMemo, setMemos, setTags } from "../store/modules/memo";
+import store from "../store";
 import userService from "./userService";
 
-class MemoService {
-  public initialized = false;
+const convertResponseModelMemo = (memo: Memo): Memo => {
+  return {
+    ...memo,
+    createdTs: memo.createdTs * 1000,
+    updatedTs: memo.updatedTs * 1000,
+  };
+};
 
-  public getState() {
-    return appStore.getState().memoState;
-  }
+const memoService = {
+  getState: () => {
+    return store.getState().memo;
+  },
 
-  public async fetchAllMemos() {
+  fetchAllMemos: async () => {
     if (!userService.getState().user) {
       return false;
     }
 
     const data = await api.getMyMemos();
-    const memos: Memo[] = data.filter((m) => m.rowStatus !== "ARCHIVED").map((m) => this.convertResponseModelMemo(m));
-    appStore.dispatch({
-      type: "SET_MEMOS",
-      payload: {
-        memos,
-      },
-    });
-
-    if (!this.initialized) {
-      this.initialized = true;
-    }
+    const memos: Memo[] = data.filter((m) => m.rowStatus !== "ARCHIVED").map((m) => convertResponseModelMemo(m));
+    store.dispatch(setMemos(memos));
 
     return memos;
-  }
+  },
 
-  public async fetchDeletedMemos() {
+  fetchDeletedMemos: async () => {
     if (!userService.getState().user) {
       return false;
     }
 
     const data = await api.getMyArchivedMemos();
     const deletedMemos: Memo[] = data.map((m) => {
-      return this.convertResponseModelMemo(m);
+      return convertResponseModelMemo(m);
     });
     return deletedMemos;
-  }
+  },
 
-  public pushMemo(memo: Memo) {
-    appStore.dispatch({
-      type: "INSERT_MEMO",
-      payload: {
-        memo: {
-          ...memo,
-        },
-      },
-    });
-  }
+  pushMemo: (memo: Memo) => {
+    store.dispatch(setMemos(memoService.getState().memos.concat(memo)));
+  },
 
-  public getMemoById(id: MemoId) {
-    for (const m of this.getState().memos) {
+  getMemoById: (id: MemoId) => {
+    for (const m of memoService.getState().memos) {
       if (m.id === id) {
         return m;
       }
     }
 
     return null;
-  }
+  },
+
+  archiveMemoById: async (id: MemoId) => {
+    const memo = memoService.getMemoById(id);
+    if (!memo) {
+      return;
+    }
 
-  public async hideMemoById(id: MemoId) {
     await api.archiveMemo(id);
-    appStore.dispatch({
-      type: "DELETE_MEMO_BY_ID",
-      payload: {
-        id: id,
-      },
-    });
-  }
+    store.dispatch(
+      patchMemo({
+        ...memo,
+        rowStatus: "ARCHIVED",
+      })
+    );
+  },
 
-  public async restoreMemoById(id: MemoId) {
+  restoreMemoById: async (id: MemoId) => {
     await api.restoreMemo(id);
     memoService.clearMemos();
     memoService.fetchAllMemos();
-  }
+  },
 
-  public async deleteMemoById(id: MemoId) {
+  deleteMemoById: async (id: MemoId) => {
     await api.deleteMemo(id);
-  }
+  },
 
-  public editMemo(memo: Memo) {
-    appStore.dispatch({
-      type: "EDIT_MEMO",
-      payload: memo,
-    });
-  }
+  editMemo: (memo: Memo) => {
+    store.dispatch(patchMemo(memo));
+  },
 
-  public updateTagsState() {
-    const { memos } = this.getState();
+  updateTagsState: () => {
+    const { memos } = memoService.getState();
     const tagsSet = new Set<string>();
     for (const m of memos) {
       for (const t of Array.from(m.content.match(TAG_REG) ?? [])) {
@@ -101,69 +94,49 @@ class MemoService {
       }
     }
 
-    appStore.dispatch({
-      type: "SET_TAGS",
-      payload: {
-        tags: Array.from(tagsSet).filter((t) => Boolean(t)),
-      },
-    });
-  }
+    store.dispatch(setTags(Array.from(tagsSet).filter((t) => Boolean(t))));
+  },
 
-  public clearMemos() {
-    appStore.dispatch({
-      type: "SET_MEMOS",
-      payload: {
-        memos: [],
-      },
-    });
-  }
+  clearMemos: () => {
+    store.dispatch(setMemos([]));
+  },
 
-  public async getLinkedMemos(memoId: MemoId): Promise<Memo[]> {
-    const { memos } = this.getState();
+  getLinkedMemos: async (memoId: MemoId): Promise<Memo[]> => {
+    const { memos } = memoService.getState();
     return memos.filter((m) => m.content.includes(`${memoId}`));
-  }
+  },
 
-  public async createMemo(content: string): Promise<Memo> {
+  createMemo: async (content: string): Promise<Memo> => {
     const memo = await api.createMemo({
       content,
     });
-    return this.convertResponseModelMemo(memo);
-  }
+    return convertResponseModelMemo(memo);
+  },
 
-  public async updateMemo(memoId: MemoId, content: string): Promise<Memo> {
+  updateMemo: async (memoId: MemoId, content: string): Promise<Memo> => {
     const memo = await api.patchMemo({
       id: memoId,
       content,
     });
-    return this.convertResponseModelMemo(memo);
-  }
+    return convertResponseModelMemo(memo);
+  },
 
-  public async pinMemo(memoId: MemoId) {
+  pinMemo: async (memoId: MemoId) => {
     await api.pinMemo(memoId);
-  }
+  },
 
-  public async unpinMemo(memoId: MemoId) {
+  unpinMemo: async (memoId: MemoId) => {
     await api.unpinMemo(memoId);
-  }
+  },
 
-  public async importMemo(content: string, createdAt: string) {
+  importMemo: async (content: string, createdAt: string) => {
     const createdTs = Math.floor(utils.getTimeStampByDate(createdAt) / 1000);
 
     await api.createMemo({
       content,
       createdTs,
     });
-  }
-
-  private convertResponseModelMemo(memo: Memo): Memo {
-    return {
-      ...memo,
-      createdTs: memo.createdTs * 1000,
-      updatedTs: memo.updatedTs * 1000,
-    };
-  }
-}
-
-const memoService = new MemoService();
+  },
+};
 
 export default memoService;