start to load messages from rooms

front/src/store/store.js

@@ -1,7 +1,7 @@
 import API from "@/services/imapAPI";
 import { createStore } from "vuex";
 
-const roomsStore = createStore({
+const store = createStore({
     state() {
         return {
             rooms: [
@@ -9,40 +9,50 @@ const roomsStore = createStore({
                     id: 0,
                     user: "clemnce",
                     userId: 0,
-                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
                     mailboxId: 1,
                 },
                 {
+                    id: 1,
                     user: "juliette",
-                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
                     mailboxId: 1,
                 },
                 {
+                    id: 2,
                     user: "jean",
-                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
                     mailboxId: 2,
                 },
                 {
+                    id: 3,
                     user: "luc",
-                    name: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
+                    roomName: "Lorem magna minim cillum labore ex eiusmod proident excepteur sint irure ipsum.",
                     mailboxId: 2,
                 },
+            ],
+            messages: [
+
             ],
             mailboxes: [],
-            activeMailbox: -1,
+            activeMailbox: 0,
+            activeRoom: 0
         };
     },
     mutations: {
         setActiveMailbox(state, payload) {
             state.activeMailbox = payload;
+
+            // todo call actions
+            // fetch rooms for this mailboxes if not already fetched
             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
+                    mailbox.fetched = true;
                     res.data.forEach((room) => {
+                        room.fetched = false;
                         state.rooms.push(room);
                     });
                 }).catch((err) => {
@@ -50,6 +60,24 @@ const roomsStore = createStore({
                 });
             }
         },
+        setActiveRoom(state, payload) {
+            state.activeRoom = payload;
+            // todo call actions
+            // fetch messages for this room if not already fetched
+            const room = state.rooms.find((room) => room.id == payload);
+            if (!room || room?.fetched == false) {
+                console.log("add messages")
+                API.getMessages(payload).then((res) => {
+                    // todo add if not exist
+                    room.fetched = true;
+                    res.data.forEach((msg) => {
+                        state.messages.push(msg);
+                    });
+                }).catch((err) => {
+                    console.log(err)
+                });
+            }
+        },
         addMailboxes(state, payload) {
             payload.forEach((mailbox) => {
                 mailbox.fetched = false;
@@ -59,10 +87,16 @@ const roomsStore = createStore({
     },
     getters: {
         rooms: (state) => () => {
-            console.log(state.rooms.length)
-            if (state.activeMailbox == 0) return state.rooms;
+            if (state.activeMailbox === 0) return state.rooms;
             return state.rooms.filter((room) => room.mailboxId == state.activeMailbox);
         },
+        messages: (state) => (roomId) => {
+            const room = state.rooms.find((room) => room.id === roomId);
+            if (room?.fetched === false) {
+                console.log("ok")
+            }
+            return [1, 2];
+        }
     },
     actions: {
         async fetchMailboxes(context) {
@@ -75,7 +109,10 @@ const roomsStore = createStore({
                     console.log(err);
                 });
         },
+        async fetchMessages(context) {
+            console.log(context)
+        },
     },
 });
 
-export default roomsStore;
+export default store;