fetch rooms

front/src/store/rooms.js

@@ -2,65 +2,80 @@ import API from "@/services/imapAPI";
 import { createStore } from "vuex";
 
 const roomsStore = createStore({
-  state() {
-    return {
-      rooms: [
-        {
-          users: "clemnce",
-          object:
-            "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
-          mailbox: 1,
-        },
-        {
-          users: "juliette",
-          object:
-            "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
-          mailbox: 1,
-        },
-        {
-          users: "jean",
-          object:
-            "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
-          mailbox: 2,
-        },
-        {
-          users: "luc",
-          object:
-            "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
-          mailbox: 2,
-        },
-      ],
-      mailboxes: [],
-      activeMailbox: -1
-    };
-  },
-  mutations: {
-    setActiveMailbox(state, payload) {
-        state.activeMailbox = payload;
+    state() {
+        return {
+            rooms: [
+                {
+                    id: 0,
+                    user: "clemnce",
+                    userId: 0,
+                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    mailboxId: 1,
+                },
+                {
+                    user: "juliette",
+                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    mailboxId: 1,
+                },
+                {
+                    user: "jean",
+                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    mailboxId: 2,
+                },
+                {
+                    user: "luc",
+                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    mailboxId: 2,
+                },
+            ],
+            mailboxes: [],
+            activeMailbox: -1,
+        };
+    },
+    mutations: {
+        setActiveMailbox(state, payload) {
+            state.activeMailbox = payload;
+            const mailbox = state.mailboxes.find((mailbox) => mailbox.id == payload);
+            // todo fetched mailbox all
+            if (mailbox?.fetched == false) {
+                mailbox.fetched = true;
+                console.log("add messages")
+                API.getRooms(payload).then((res) => {
+                    // todo add if not exist
+                    res.data.forEach((room) => {
+                        state.rooms.push(room);
+                    });
+                }).catch((err) => {
+                    console.log(err)
+                });
+            }
+        },
+        addMailboxes(state, payload) {
+            payload.forEach((mailbox) => {
+                mailbox.fetched = false;
+                state.mailboxes.push(mailbox);
+            });
+        },
+    },
+    getters: {
+        rooms: (state) => () => {
+            console.log(state.rooms.length)
+            if (state.activeMailbox == 0) return state.rooms;
+            return state.rooms.filter((room) => room.mailboxId == state.activeMailbox);
+        },
+    },
+    actions: {
+        async fetchMailboxes(context) {
+            console.log("add mailboxes");
+            API.getMailboxes()
+                .then((res) => {
+                    context.commit("addMailboxes", res.data);
+                })
+                .catch((err) => {
+                    console.log(err);
+                });
+        },
     },
-    addMailboxes(state, payload) {
-      payload.forEach(mailbox => {
-        state.mailboxes.push(mailbox);
-      });
-    }
-  },
-  getters: {
-    rooms: (state) => () => {
-        if (state.activeMailbox == 0) return state.rooms;
-        return state.rooms.filter(room => room.mailbox == state.activeMailbox);
-    }
-  },
-  actions: {
-    async addMailboxes(context) {
-      console.log("add mailboxes")
-      API.getMailboxes().then((res) => {
-        console.log(res.data)
-        context.commit("addMailboxes", res.data);
-      }).catch((err) => {
-        console.log(err)
-      });
-    }
-  }
 });
 
 export default roomsStore;