feat: Route list page

src/shared/store/UserStore/index.ts

@@ -10,7 +10,13 @@ export type User = {
 };
 
 class UserStore {
-  users: User[] = [];
+  users: {
+    data: User[];
+    loaded: boolean;
+  } = {
+    data: [],
+    loaded: false,
+  };
   user: Record<string, User> = {};
 
   constructor() {
@@ -18,12 +24,13 @@ class UserStore {
   }
 
   getUsers = async () => {
-    if (this.users.length > 0) return;
+    if (this.users.loaded) return;
 
     const response = await authInstance.get("/user");
 
     runInAction(() => {
-      this.users = response.data;
+      this.users.data = response.data;
+      this.users.loaded = true;
     });
   };
 
@@ -42,7 +49,7 @@ class UserStore {
     await authInstance.delete(`/user/${id}`);
 
     runInAction(() => {
-      this.users = this.users.filter((user) => user.id !== id);
+      this.users.data = this.users.data.filter((user) => user.id !== id);
       delete this.user[id];
     });
   };
@@ -64,12 +71,15 @@ class UserStore {
   };
 
   createUser = async () => {
-    const id = this.users[this.users.length - 1].id + 1;
+    let id = 1;
+    if (this.users.data.length > 0) {
+      id = this.users.data[this.users.data.length - 1].id + 1;
+    }
     const response = await authInstance.post("/user", this.createUserData);
 
     runInAction(() => {
-      this.users.push({
-        id,
+      this.users.data.push({
+        id: id,
         ...response.data,
       });
     });
@@ -95,7 +105,7 @@ class UserStore {
     const response = await authInstance.patch(`/user/${id}`, this.editUserData);
 
     runInAction(() => {
-      this.users = this.users.map((user) =>
+      this.users.data = this.users.data.map((user) =>
         user.id === id ? { ...user, ...response.data } : user
       );
       this.user[id] = { ...this.user[id], ...response.data };